قائمة DB التي تم إنشاؤها غير تعمل عند الإنشاء باستخدام JQuery

Question

لدي نموذج بسيط يحتوي على قائمة (القائمة المنسدلة التي تم إنشاؤها من DB)، عندما يقوم المستخدم بإجراء عملية اختيار، يتم طباعة التحديد على الشاشة. المشكلة التي أواجهها هي أنه إذا كنت تستخدم JQuery لاستدعاء php funciton الذي ينشئ القائمة عند تحميل الصفحة، فلن تعمل القائمة، ولكن إذا قمت بإضافة الرمز مباشرة في HTML سيعمل

عند تحميل الصفحة يتم استدعاء قائمة المنسدلة مثل هذا:

$('#createDropDown').ready(function(){
        id = $('#createDropDown').val(); 
        // this calls a php function that creates a dropdown list from the DB
        // the dropdown's id = 'categoryList'
        xajax_addDropdownMenu(id);


});

يتم إنشاء القائمة مع معرف = 'فئة القائمة, ، يتم إلحاقها بشكل صحيح إلى DIV CreateDropdown يسمى "CreateDropdown". حتى الآن كل شيء يبدو جيدا! المشكلة تأتي عند إجراء عملية اختيار في القائمة التي تم إنشاؤها حديثا (قائمة الفئة) تسمى جيس الآخر

عند إجراء الاختيار، يجب استدعاء التعليمة البرمجية التالية:

$('#categoryList').change(function() {
    bucket_id = $('#categoryList').val(); 
    var selected = "";
    // get selected value from the dropdown menu
        $("#categoryList option:selected").each(function () {
            selected += $(this).text() + " ===>";
         });
        // if we have a valid ID print it in the screen.
        if(bucket_id!= 0)
        {
            xajax_addCategory(selected);
        }
     });

XAJAX_ADDCategory (محدد)؛ يطبع العنصر المحدد على الشاشة. ولكن لا يعمل.

ملاحظة: يعمل هذا على موافق إذا قمت باستدعاء دالة PHP لإنشاء المنسدلة مباشرة في ملف main.html، لذلك أعرف أن القائمة يتم إنشاؤها باستخدام المعرف الصحيح ويعمل، ولكن عندما أستخدم JQuery لاستدعاء طريقة PHP عند الحمل، لا يعمل ... وأنا لا أفهم السبب.

PS أنا مستجد من مسج لذا فإن بعض البصيرة ستكون موضع ترحيب كبير!

---

تحديث:

حاولت إنشاء ملزمة بعد إنشاء القائمة مثل هذا:

 
$('#createDropDown').ready(function()
    { 
        id = $('#createDropDown').val();  
        xajax_addDropdownMenu(id); 
        $("#categoryList0").bind('change',function() 
        { 
            console.log('The code goes here!!'); 
        }); 
    }); 
 

أين فئة القائمة 0 هي المعرف القائمة الجديدة. فئة القائمة هي قائمة الفئة

لكنني ما زلت عالقا لأنه لا يزال لا يدخل في الوظيفة عندما يكون هناك تغيير ...

Answer 1

تجد Snippet الرمز الثاني الخاص بك جميع العناصر التي تتطابق مع # الفضلات وتطل على وظيفة إلى حدث التغيير. المشكلة هي أنه لا يوجد عنصر قائمة # الفئات في ذلك الوقت، لأنك تنشئها لاحقا. وبالتالي تحتاج إلى القيام الربط بعد إنشاء القائمة.

Answer 2

لقد وجدت طريقة للقيام بربط لاحقا باستخدام Xajax. لسبب ما لا يوجد مكان في ملف JQuery، كنت قادرا على ربط هذه الوظيفة مع المنسدلة الجديدة. كان الحل الخاص بي لإضافة SCRIP مسج باستخدام Xajaxresopnse-> AddScript (البرنامج النصي) في adddropdropdownmenu. funciton مثل هذا

وظيفة adddropdropdownmenu ($ معرف) {

  $xajaxResponse = new xajaxResponse();

  $html = /* CODE TO GENERATE LIST HERE */ ; 


  $javascript = /*"*///commented out " to visualize code better
    $('#categoryList').bind('change',function categoryListChange() 
    {
     
      //get selected value from the dropdown menu
      var selected = "";
      $("#categoryList option:selected").each(function () 
      {
        selected += $(this).text();
       });

      bucketId = $('#categoryList').val(); 

      if(bucketId!= 0)
      {
        xajax_addCategory(selected);
      }

    });"";

  $xajaxResponse->addAppend("categoryListContainer", "innerHTML", $html);

  $xajaxResponse->addScript($javascript);

  return $xajaxResponse;  

}

أول القيام بربط للحصول على قائمة جديدة مثل هذا $ ('# فئة قائمة'). ربط ("تغيير"، وظيفة فئة القائمة () {...} ثم قم بإضافة البرنامج النصي المسج XAJAXResponse-> AddScript ($ JavaScript)؛.