循环或通配符通过JQuery UI Javascript集成

Question

I am calling the content of a PHP file via AJAX similar to this:

NEW.PHP

$output =  '<p>Date: <input type="text" id="field_1"></p>
            <p>Date: <input type="text" id="field_6"></p>
            <p>Date: <input type="text" id="field_7"></p>';

echo $output;

The inputs are generated dynamically depending on options the user selected. In this case, field_1 and field_7 would be date picker fields and field_6 would be a standard text box.

In my main page, the jQuery success handler looks like this:

success: function(result){
    jQuery('#div-custom').html(result).show();                
    jQuery("#div-custom").find("#field_1,#field_7" ).datepicker({
              numberOfMonths: 3,
              showButtonPanel: true
    });
}

The issue I'm having is that the number of date picker fields is dynamic and the field number field_X can be different. Is there a way to make this find("#field_1,#field_7") dynamic or use a wildcard? I can change my PHP code so that, for example, all date picker fields are called date_X and other fields are field_X.

In that case, I'd like to do something like find("#date_*) but don't know if that's possible. I'm definitely not strong with Javascript.

Really appreciate any help!

Answer 1

You should use a class as you can use the same class on multiple items unlike ids

<p>Date: <input type="text" class="cal" id="field_X"></p>

jQuery("#div-custom").find(".cal" ).datepicker({