मैं jQuery अजाक्स के साथ गतिशील रूप से ड्रॉपडाउन सूची उत्पन्न करता हूं, उत्पन्न ड्रॉपडाउन आईडी specificationAttribute है। मैं चाहता हूं कि नए टैग के लिए ऐड इवेंट बनाया गया (specificationAttribute), ऐसा करने के लिए मैंने window.load में नीचे script बनाया:
$(document).on('change', '#specificationattribute', function () {
alert("Clicked Me !");
});
लेकिन इससे काम नहीं होता । मैं किसी भी तरह से click , live की तरह कोशिश करता हूं लेकिन मुझे कोई परिणाम नहीं मिल रहा है।
बेला से कोड:
$(window).load(function () {
$("#specificationCategory").change(function () {
var selected = $(this).find(":selected");
if (selected.val().trim().length == 0) {
ShowMessage('please selecet ...', 'information');
}
else {
var categoryId = selected.val();
var url = $('#url').data('loadspecificationattributes');
$.ajax({
url: url,
data: { categoryId: categoryId, controlId: 'specificationattribute' },
type: 'POST',
success: function (data) {
$('#specificationattributes').html(data);
},
error: function (response) {
alert(response.error);
}
});
}
});
$(document).on('change', '#specificationAttribute', function () {
alert("changed ");
});
}
3 जवाब
आपकी पहेली में वाक्यविन्यास त्रुटियां हैं। चूंकि ड्रॉपडाउन सूची एक चयन उत्पन्न करती है, आइए एक का उपयोग करें।
मेरे उत्तर के लिए मैंने इस HTML का उपयोग किया, इस पर और बाद में: चीजें आपके कोड में मेल नहीं खातीं
<select id="specificationAttribute" name="specificationAttribute">
</select>
कोड अपडेट किया गया: (इनलाइन टिप्पणियां देखें, कुछ सुझाव हैं, कुछ त्रुटियां हैं)
$(window).on('load', function() {
$("#specificationCategory").on('change',function() {
var selected = $(this).find(":selected");
// if there is a selection, this should have a length so use that
// old: if (selected.val().trim().length == 0) {
if (!selected.length) { // new
// NO clue what this is and not on the fiddle so commented it out
// ShowMessage('please selecet ...', 'information');
alert("select something a category");// lots of ways to do this
} else {
var categoryId = selected.val();
var url = $('#url').data('loadspecificationattributes');
$.ajax({
url: url,
data: {
categoryId: categoryId,
controlId: 'specificationattribute'
},
type: 'POST',
success: function(data) {
// THIS line id does not match my choice of specificationAttribute so I changed it
$('#specificationAttribute').html(data);
},
error: function(response) {
alert(response.error);
}
});
}
});
// THIS should work with the markup I put as an example
$(document).on('change', '#specificationAttribute', function() {
alert("changed ");
});
});// THIS line was missing parts
@उथमान, ऐसा हो सकता है कि आपने एक्सचेंज इवेंट में गलत आईडी का चयन करने और उसका उपयोग करने के लिए अलग-अलग आईडी दी हो, जैसा कि मैंने jsfiddle लिंक https://jsfiddle.net/a65m11b3/4/`
success: function (data) {
$('#specificationattributes').html(data);
},and $(document).on('change', '#specificationAttribute', function () {
alert("changed ");
}); $(document).on('change', '#specificationAttribute', function () {
alert("changed ");
});.
यह काम नहीं करता है क्योंकि घटना को जोड़ने के समय आपका एचटीएमएल तत्व अभी तक मौजूद नहीं है।
आपको जो चाहिए वह प्रत्यायोजित घटनाएं हैं। असल में, आप ईवेंट को मूल तत्व से जोड़ते हैं + आपके पास बच्चे के लिए चयनकर्ता होता है (आमतौर पर क्लासनाम या टैगनाम द्वारा)। इस तरह घटना मौजूदा के लिए आग लगती है लेकिन भविष्य में जोड़े गए चयनकर्ता से मिलने वाले तत्वों के लिए भी।
यहां दस्तावेज जांचें: https://api.jquery.com/on/#on-events -चयनकर्ता-डेटा-हैंडलर
विशेष रूप से इस उदाहरण के साथ भाग लें:
$( "#dataTable tbody" ).on( "click", "tr",
function() {
console.log( $( this ).text() );
});
specificationattributeयाspecificationAttributeहै? आपने एक को नमूने में और दूसरे को अपनी टिप्पणी में इस्तेमाल किया।htmlप्रकट नहीं होता है?$(document).on('change', '#specificationAttribute', function () {केवल एक तत्व के लिए कार्य करेगा...