How to Mount a Dynamic Checkbox

Asked

Viewed 2,193 times

2

I have a:

<select name="snh_predio" id="snh_predio"></select>

Which is automatically loaded. When this is changed: 

$("#snh_predio").change(function() { });

I want you to print a list of checkbox for selection:

echo "<input type='checkbox' value='" . $sala['snh_sala'] . "' " . $checado . " name='form_snh_sala[" . $sala['snh_sala'] . "]' id='form_snh_sala[" . $sala['snh_sala'] . "]' ";

How can I do it dynamically?

javascript php html

  • I’ll leave this for someone else to answer, but I tell you that you can research on AJAX. And avoid using echo, the code gets a little dirty... you can at any time close and reopen the PHP tag (<?php ?>), and everything outside of it is text as in echo -- just don’t need to escape quotes.

3 answers

1

You can both use a select of the kind multiple.

<select type="multiple">
    <option value="1">Primeira opção</option>
    <option value="2">Segunda opção</option>
    <option value="3">Terceira opção</option>
    <option value="4">Quarta opção</option>
</select>

But in case you really want to use checkbox you will have to build all the element and all the functionality.

Regardless of how you create this, the ideal is that you use , as you will have separate layers and can control everything more efficiently and maintainability.

  • He couldn’t use the <input type="checkbox" name="conjunto_checkbox" value="op1"/> and only change the value?

  • Inside a select is not recommended, no one prevents, but the result will not be anything "beautiful" to see. Besides the HTML get all wrong

  • But I speak instead of select.

  • Yes there yes, it’s just a div with several checkbox, but from what I understand he wants to click and the list appear, just like a select does.

1


I don’t know if I understand, but when you change the < select > I imagine that you will make a search with ajax of the room data and with this data you will have to make a loop printing the checkbox, that’s it?

If that is so, when searching you can generate a json with the key/value pairs and with it loop to generate the html through javascript or generate the html with php and send it as a string and print in the part you need.

0

With pure Javascript you can do it this way:

php form.

<html>
<head>
    <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
    <script type="text/javascript">

        function listarProdutos(categoria){
            $.ajax({
                url: 'listar.php',
                data: {'categoria':categoria},
                success: function(data) {
                    $('#lista').html(data);
                }
            });
        }
    </script>
</head>
<body>

    <form>
        <select id="categoria" name="categoria" onclick="listarProdutos(this.value);">
            <option value="1">JOGOS</option>
            <option value="2">ELETRONICOS</option>
            <option value="3">ROUPAS</option>
        </select>


    Produtos:<br>
    <div id="lista"></div>
    </form>
</body>
</html>

When the combo option is changed it will call the file (example listar.php), that takes user’s 'input' query in the bank (which replaced by arrays, $games, $electronics and $clothes) and creates the checkboxes the HTML output is returned by AJAX and played in div list. This example is simple recommend that if possible remove the echo <input... by template, an engine suggestion would be Smarty

<?php
function imprimirCheckbox($arr){
    foreach($arr as $item){
        echo '<input type="checkbox"  name="produtos[]" value="'.$item.'" />'. $item .'<br>';
    }
}


$jogos = array('COD', 'FIFA 2014', 'NFS');
$roupas = array('CAMISA', 'CALÇA', 'BERMUDA');
$eletronicos = array('PC','NOTEBOOK','TABLET');

if($_GET['categoria'] == 1){
    imprimirCheckbox($jogos);
}else if($_GET['categoria'] == 2){
    imprimirCheckbox($eletronicos);
}else{
    imprimirCheckbox($roupas);
}

Browser other questions tagged javascript php html

You are not signed in. Login or sign up in order to post.