如何将数据库中的复选框添加到Jquery UI对话框中

时间:2013-10-21 18:06:07

标签: jquery checkbox jquery-ui-dialog

我有按钮,onclick从数据库中获取值并存储到javascript变量中。 现在我想将这个变量值添加到对话框中作为复选框。这是我的dilaogue框的html代码......

HTML for dialog box。

<input type="submit" name ="Select Sites" id="ssites" value="Select Sites">
   <div id="sites" title="Choose Sites">
<form action="" method="POST" id="sites">
</form>

这是我的脚本代码..

 var calltype;
   $('#ssites').click(function(evt){
     evt.preventDefault();
     $.ajax({
     url: "Calltype",              
     type: "GET", 
     success: function(data){
     calltype=data;

     var cb = $('<input/>', {
    'type':'checkbox',
    'name':'sites_radio', // so you can access it on server using this name
    'value':calltype // assumed "data" contains the value
});
$("#sites").append($('<label/>', { 'text':'CheckBox Label' }).prepend(cb))
.dialog({
    modal: true,
    buttons: {
        SUBMIT: function() {
            $(this).find('form').submit();
        }
    }
});
  },
  error:function(){
      console.log("AJAX request was a failure");
  }   
}); 
来自数据库的

复选框值位于sites变量中......

请伙计们帮助我。我不知道该怎么走......

任何帮助都将得到高度评价.. 提前谢谢..

2 个答案:

答案 0 :(得分:0)

首先,id应该是唯一的..所以将表单ID更改为

<form action="" method="POST" id="form-sites">


$.ajax({
 ...
success: function(data){
 $.each(data,function(i,v){
    $('<input />',{
         'type':'checkbox',
         'name':'someName',
         'value':'someValue'
     }).appendTo('#form-sites');
 }); 
},
...
 jQuery("#sites").dialog({
  modal: true,
  buttons: {
     SUBMIT: function() {
         $('#form-sites').submit();
     }
  }
});

答案 1 :(得分:0)

您的HTML不对,问题有点令人困惑,但要在表单中添加checkbox,其值为ajaxsuccess回调中)并制作它(网站div)dilog使用jQuery ui,您可以在success回调中尝试这样的事情

success:function(data){
    var cb = $('<input/>', {
        'type':'checkbox',
        'name':'sites_radio', // so you can access it on server using this name
        'value':data // assumed "data" contains the value
    });
    $("#sites").append($('<label/>', { 'text':'CheckBox Label' }).prepend(cb))
    .dialog({
        modal: true,
        buttons: {
            SUBMIT: function() {
                $(this).find('form').submit();
            }
        }
    });
}

An Example.

更新:(您的array(评论中提及)似乎有data),因此您应该在{{1}中使用类似的内容回调(Updated Demo.

success