Disable options based on the selected

Question

Fiddle

Please help me. I have already searched for this information, but I cannot find the exact solution.

I have two drop-down lists: one for selecting "from date", and the other - to date. For example: If I select 10 from the “from date” drop-down list, the parameters located in “by date” of less than 10 and 10 should be disabled in the “by date” drop-down list.

Note. The table rows that are in the script are not static 2 rows. It may be 3 or more than

Here is my code

$(".tfdate").change(function() { 
var target   = $(this).parent().siblings().find("select.ttdate");
target.find("option").removeAttr("disabled");
var selected = $(this).val();
target.find("option").prevUntil("option[value='"+selected+"']").attr('disabled','disabled');
//target.find("option").prevAll("option[value='"+selected+"']").attr('disabled','disabled');
});

From date

Today

Answer 1

, , jQuery datepicker, , , ​​ (.. - 30 ), ..

, ( ) , filter :

var selected = parseInt($(this).val());
target.find("option").filter(function () {
    return parseInt($(this).val()) === selected 
        || parseInt($(this).val()) < selected;
}).attr('disabled','disabled');

Answer 2

jquery date picker, ,

DEMO

$(document).ready(function () {

    $("#dt1").datepicker({
        dateFormat: "dd-M-yy",
        minDate: 0,
        onSelect: function (date) {
            var date2 = $('#dt1').datepicker('getDate');
            date2.setDate(date2.getDate() + 1);
            $('#dt2').datepicker('setDate', date2);
            //sets minDate to dt1 date + 1
            $('#dt2').datepicker('option', 'minDate', date2);
        }
    });
    $('#dt2').datepicker({
        dateFormat: "dd-M-yy",
        onClose: function () {
            var dt1 = $('#dt1').datepicker('getDate');
            console.log(dt1);
            var dt2 = $('#dt2').datepicker('getDate');
            if (dt2 <= dt1) {
                var minDate = $('#dt2').datepicker('option', 'minDate');
                $('#dt2').datepicker('setDate', minDate);
            }
        }
    });
});

UPDATE:

DEMO

,

$('#mybtn').click(function() {  
        var clone = $('.child:first').clone(true).appendTo('#child');
        clone.find('.myclass').datepicker();
});

Answer 3

:

$(".tfdate").change(function() { 
   $(this).closest('tr')
          .find('.ttdate option')
          .prop('disabled', false)
          .filter('[value="'+ this.value +'"]')
          .prevAll()
          .addBack()
          .prop('disabled', true);
});

http://fiddle.jshell.net/C66rf/