Как добавить флажки из базы данных в диалоговое окно Jquery UI

0

У меня есть кнопка, которая onclick получает значение из базы данных и сохраняет в javascript переменную. Теперь я хочу добавить эти значения переменных в диалоговое окно как checkbox.here - мой html-код для окна dilaogue...

HTML для диалогового окна.

<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");
  }   
}); 

значения флажка из базы данных находятся в переменных сайтов...

пожалуйста, ребята, помогите мне. Я понятия не имею, как идти дальше..

Любая помощь будет высоко оценена.. Спасибо заранее..

  • 0
    Ваш HTML кажется неправильным, это все, что у вас есть?
Теги:
checkbox
jquery-ui-dialog

2 ответа

0
Лучший ответ

в первую очередь идентификатор должен быть уникальным.. поэтому измените свой идентификатор формы на

<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();
     }
  }
});
  • 0
    Сэр, я отредактировал мой пост с вашим кодом. Теперь столько флажков появилось, а имя флажка тоже не пришло ... где только пять значений в переменной calltype
  • 0
    Можете ли вы показать мне свою структуру данных, возвращенных в функции успеха
Показать ещё 3 комментария
0

Ваш HTML не подходит и вопрос немного запутанный, но добавить checkbox в форме с полученным значением от ajaxsuccess обратного вызова) и сделать его (сайты ДИВ) а dilog с помощью jQuery ui, вы можете попробовать ssomething, как это в вашем обратный вызов 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();
            }
        }
    });
}

Пример.

Обновление: (похоже, у вас есть array в ваших data (упомянутый в комментарии)), поэтому вы должны использовать что-то вроде этого в своем success вызове success ( обновлено демо).

success:function(data){
    // assumed "data" contains following array
    // ['LOCAL', 'STD', 'ISD', 'INCOMING', 'INET'];
    $.each(data, function(k, v){
        var cb = $('<input/>', {
            'type':'checkbox',
            'name':'sites_radio',
            'value':v
        });

        $("#sites").append($('<label/>', {
            'style':'display:block',
            'text':v
        }).prepend(cb))
    });

    $('#sites').dialog({
        modal: true,
        buttons: {
            SUBMIT: function() {
                $(this).find('form').submit();
            }
        }
    });
}
  • 0
    Спасибо, сэр, за ваш ответ, сейчас идет один флажок, и это CheckBox Label, но я хочу показать флажки из значений, полученных при вызове ajax.
  • 0
    пожалуйста, смотрите мой обновленный код ..
Показать ещё 3 комментария

Ещё вопросы

Сообщество Overcoder
Наверх
Меню