jQuery的$（）。改變（使用$就對話框

我開口，其動態加載Ajax內容的對話功能（）。

該對話框可以由多個按鈕（CT頭部，胸部CT等被打開）

當對話框打開有一個<選擇> < /選擇與監聽到發生.change事件處理程序>菜單。

我遇到的問題是，.change ISN」。 t被觸發：

<script> 
$(document).ready(function(){ 

$("button.ctIndicationList").change(function() { 
    // alert('Value change to ' + $(this).attr('value')); <-- this won't trigger 
    $('#dialogResult').html("loading..."); 
    $.ajax({ 
     type: "POST", 
     url: $(this).attr('value') + ".php", 
     // data: "q=" + $("#q").val(), 
     success: function(msg){ 
     $('#dialogResult').html(msg); 
      // alert("Data Saved: " + msg); 
     } 
    });   

}); 
$("#requestStudy").click(function() { 
    alert('Your study has been ordered'); 
    $("#dialog-form").dialog("close"); 
}); 
$("button.create-user") 
    .button() 
    .click(function() { 
     alert($(this).attr('value') + ".php"); 
     // $("input.create-user").change(function() { 
      $.ajax({ 
       type: "POST", 
       url: $(this).attr('value') + ".php", 
       // data: "q=" + $("#q").val(), 
       success: function(msg){ 
       $('#dialogResult').html(msg); 
        // alert("Data Saved: " + msg); 
       } 
      }); 
      // $("#dialog-form").load($(this).attr('value') + ".php","?opt1=Cron&opt2=Spron"); 
      // $("#dialog-form").dialog("open"); 
     // }); 

     $("#dialog-form").dialog("open"); 
}); 
$('#dialog-form').dialog({ bgiframe: true, 
    height: 600, 
    width: 800, 
    autoOpen: false, 
    modal: true, 
    overlay: { 
     backgroundColor: '#000', 
     opacity: 0.5 
    }     
}); 

}); 
</script>

...

<div> 
<div id="dialog-form" title="Radiology Requisition" style="display:none;"> 
<p class="validateTips">All form fields are required.</p> 
<form> 
<fieldset> 
    <p>Indication: 
    <select id="ctIndicationList" class="ctIndicationList"> 
    <option value="ajaxheadInjury">head injury</option> 
    <option value="ajaxstroke">stroke/TIA</option> 
    </select></p> 
<p><label for="email">Clinical History</label></p> 
<p><input type="text" name="email" id="email" value="" class="text ui-widget-content ui-corner-all" size="60" /></p> 
<p><label for="email">Differential Diagnosis</label></p> 
<P>1. <input type="text" name="email" id="email" value="" class="text ui-widget-content ui-corner-all" size="60" /> 
<p>2. <input type="text" name="email" id="email" value="" class="text ui-widget-content ui-corner-all" size="60" /> 
<p>3. <input type="text" name="email" id="email" value="" class="text ui-widget-content ui-corner-all" size="60" /> 
<p id="dialogResult">result is here</p> 
<p><button id="requestStudy">Request Study</button><p> 
</fieldset> 
</form> 
</div> 

<p><button class="create-user" value="formCThead">CT Head - minor head injury</button></p> 
<p><button class="create-user" value="formCTchest">CT Chest</button></p> 
<p><button class="create-user" value="formCTabdomen">CT Abdomen/Pelvis</button></p> 
<p><button class="create-user" value="formCTcarotid">CT Carotid Angiogram</button></p>     
<p><button class="create-user" value="formCTcspine">CT c-spine</button></p> 

</div>

其中formCT __。PHP文件動態加載到對話框下方的..他們看起來都差不多。您會注意到< select id =「ctIndicationList」>位於此處。這是我想要觸發的。

<form> 
<fieldset> 
    <p>Indication: 
    <select id="ctIndicationList"> 
     <option value="ajaxheadInjury">head injury</option> 
     <option value="ajaxstroke">stroke/TIA</option> 
    </select></p> 
    <p><label for="email">Clinical History</label></p> 
    <p><input type="text" name="email" id="email" value="" class="text ui-widget-content ui-corner-all" size="60"></input></p> 
    <p><label for="email">Differential Diagnosis</label></p> 
    <P>1. <input type="text" name="email" id="email" value="" class="text ui-widget-content ui-corner-all" size="60"></input></p> 
    <p>2. <input type="text" name="email" id="email" value="" class="text ui-widget-content ui-corner-all" size="60"></input></p> 
    <p>3. <input type="text" name="email" id="email" value="" class="text ui-widget-content ui-corner-all" size="60"></input></p> 
    <p id="dialogResult">result is here</p> 
    <p><button id="requestStudy">Request Study</button><p> 
</fieldset> 
</form>

來源

2012-07-12 mandalorianwarrior

您需要委託處理程序，因爲你選擇器來代替目標元件不會在頁面加載時，你也有button.ctIndicationList存在select.ctIndicationList

$(document/* or some container element */).on('change', "select.ctIndicationList", function() { 
    // alert('Value change to ' + $(this).attr('value')); <-- this won't trigger 
    $('#dialogResult').html("loading..."); 
    $.ajax({ 
     type: "POST", 
     url: $(this).attr('value') + ".php", 
     // data: "q=" + $("#q").val(), 
     success: function(msg){ 
      $('#dialogResult').html(msg); 
      // alert("Data Saved: " + msg); 
     } 
    });   
});

來源

2012-07-12 04:57:37 Musa

jQuery的$（）。改變（使用$就對話框

回答

相關問題