2015-09-15 3 views
0

У меня есть похожие, как и массовые флажки, которые я хочу выбрать на основе значения базы данных. Если я сброшу значение базы данных в строку, такую ​​как DC0 | 100; DK0 | 100; DM0-SRM | 200; DR0 | 300 (; разделитель или что-то еще). Как выбрать флажок на основе значений, используя JAVASCRIPT или AJAXJavascript Как установить флажок на основе разделительной строки со значениями

Ниже приведены образцы Флажок:

<input type='checkbox' id='systemclient[]' name='systemclient[]' value='DB0|100' /> 
<input type='checkbox' id='systemclient[]' name='systemclient[]' value='DB5|100' /> 
<input type='checkbox' id='systemclient[]' name='systemclient[]' value='DC0|100' /> 
<input type='checkbox' id='systemclient[]' name='systemclient[]' value='DE0|100' /> 
<input type='checkbox' id='systemclient[]' name='systemclient[]' value='DG0|200' /> 
<input type='checkbox' id='systemclient[]' name='systemclient[]' value='DG0|300' /> 
<input type='checkbox' id='systemclient[]' name='systemclient[]' value='DK0|100' /> 
<input type='checkbox' id='systemclient[]' name='systemclient[]' value='DL0|200' /> 
<input type='checkbox' id='systemclient[]' name='systemclient[]' value='DL0|300' /> 
<input type='checkbox' id='systemclient[]' name='systemclient[]' value='DM0-SRM|200' /> 
<input type='checkbox' id='systemclient[]' name='systemclient[]' value='DM0-SRM|300' /> 
<input type='checkbox' id='systemclient[]' name='systemclient[]' value='DM0-SUS|210' /> 
<input type='checkbox' id='systemclient[]' name='systemclient[]' value='DM0-SUS|310' /> 
<input type='checkbox' id='systemclient[]' name='systemclient[]' value='DR0|200' /> 
<input type='checkbox' id='systemclient[]' name='systemclient[]' value='DR0|300' /> 
<input type='checkbox' id='systemclient[]' name='systemclient[]' value='DV0|100' /> 
<input type='checkbox' id='systemclient[]' name='systemclient[]' value='DX0|100' /> 
+0

Вы должны отредактировать свой вопрос, трудно читать вот так – Saar

ответ

0

увидеть эту скрипку: http://jsfiddle.net/8ubk5c0f/2/

$(function(){ 
     var stringFromServer = "DC0|100;DK0|100;DM0-SRM|200;DR0|300"; 
     var arrayOfValues = stringFromServer.split(";"); 
     var $checkboxes = $("input[type=checkbox]"); 
     $checkboxes.each(function(idx, element){ 
      if(arrayOfValues.indexOf(element.value) != -1){ 
       element.setAttribute("checked", "checked"); 
      } 
      else{ 
       element.removeAttribute("checked"); 
      } 
     }); 
    }); 
+0

вы, ребята, самые лучшие. :) –

+0

Как использовать ту же функцию после загрузки HTML-документа? поскольку флажки генерируются во время загрузки php-страницы. –

+0

Эта функция выполняется только после загрузки HTML. просто убедитесь, что у вас есть jQuery – Saar

0

Попробуйте ниже код. См JSFiddle demo

var queryRes = "DC0|100;DK0|100;DM0-SRM|200;DR0|300"; 

// split string result by ';' char 
var resArray = queryRes.split(';'); 

// Iterate splite items 
resArray.forEach(function(item){ 
    // Select checkbox using value got from query and 
    // set its 'checked' attribute to TRUE 
    $('input[type="checkbox"][value="' + item + '"]').attr('checked', true); 
}); 
+0

Спасибо за вашу помощь. –

0

Во-первых, вам нужно уникальный идентификатор на вашем входных элементов. В вашем примере кода все входные элементы имеют id = 'systemclient []'.

Я предполагаю, что у вас есть строковые данные из вашей базы данных в JavaScript, и вам просто нужно проверить флажки, соответствующие синтаксической строкой.

Чтобы разобрать строку:

var stringArray = myDataString.split(";"); //where ";" is the string delimiter 

итерации над вашими флажками и посмотреть на матч

$("input[name*='systemclient[]']").each(function(){ 
    console.log($(this)); //verify you're able to target the element 
    if($.inArray($(this).val(), stringArray) !== -1) { 
     $(this).prop('checked', true); 
    } else { 
     $(this).prop('checked', false); 
    } 
}); 
+0

Спасибо за вашу помощь. –

0

Не зная, какие библиотеки вы имеете в своем распоряжении [ваниль JS =)] вы бы разделить ваша строка путем выбора выбора в массив, затем перебираем массив, просматривая флажок по запросу dom select, а затем устанавливаем свойство dom node checked в значение true.

var foos = str.split(';'); 
foos.map(function(foo){ 
    var checkbox = document.querySelectorAll("input[type='checkbox'[value='" + foo + "']"); 
    checkbox.checked = true; 
}); 
+0

oh и +1 для уникальных идентификаторов! – CainBot

+0

Спасибо за вашу помощь. –

Смежные вопросы