How to not repeat the same input request

Question

How to not repeat the same input request

Navigation

#1 by (2 votes)

0

I need to create a page where I can choose a PLAN (or more) and a PLOT for each chosen plane. At the moment, when I make the foreground choice, it is interfering with the options available for the background choice, and this is not the desired behavior. I would like every% of plan% and its respective% share% to be independent of the other plans added.

Plan A:
Third Plot
Fifth Plot

Plan B:
First Plot
Second Plot
Third Plot
Fourth Plot

PlanJSCode

$(document).ready(function(){$(".plano").change(function()
    {
        var id=$(this).val();
        var dataString = 'id='+ id;
        $.ajax
        ({
            type: "POST",
            url: "get_plano2.php",
            data: dataString,
            cache: false,
            success: function(html)
            {
                $(".parcela").html(html);
            } 
        });
    });
});

html code

<td>
    <select name="usuarios[0][plano]" class="plano">
        <option selected="selected">Selecione</option>
            <?php
                $stmt = $DB->prepare("SELECT * FROM plano");
                    $stmt->execute();
                        while($row=$stmt->fetch(PDO::FETCH_ASSOC))
                    {
            ?>
            <option value="<?php echo $row['id_plano']; ?>"><?php echo $row['nome_plano']; ?></option>
            <?php
                    } 
            ?>
    </select>
</td>
<td>
    <select name="usuarios[0][parcela]" class="parcela">
        <option selected="selected">Selecione</option>
    </select>
</td> 
<td>
    <input type="text" name="usuarios[0][comissao_vendedor]" id="valor_total_saude_vendedor" class="calcular" placeholder="R$" onkeypress="mascara(this,mreais)" onkeyup="calcular()">
</td>

Javascript code

var AddTableRow = function(el) {
        var tbody = $(el).closest('table').find('tbody');
        var row = tbody.find('tr:last').clone();
        var name = row.find('.calcular').attr('name');
        var index = parseInt(name.match(/usuarios\[(\d+)\]\[comissao_vendedor\]/)[1], 10) + 1;
        row.find('[name^="usuarios["]').each(function() {
            if (this.name) {
                this.name = this.name.replace(/^usuarios\[\d+\]/, "usuarios[" + index + "]");
            }
        });
        tbody.append(row);
    };

php mysql javascript

asked by anonymous 28.01.2017 / 20:38

1 answer

Passing parameter in the FILTER of an array in JavaScript windows service c # - error 1053

score 2 · Accepted Answer

The request of AJAX must enter the data in its tr , otherwise a change in one of Planos will affect all classes of Parcelas .

$(document).ready(function(){

    $(document).on("change", ".plano", function(){
        var $t = $(this); // << Permite o "this" ser acessado dentro do AJAX
        var id = $t.val();
        var dataString = 'id='+ id;
        $.ajax({
            type: "POST",
            url: "get_plano2.php",
            data: dataString,
            cache: false,
            success: function(html){
                $t.parents('tr').find('.parcela').html(html); // << Atualiza somente o elemento que fez alteração
            } 
        });
     })    
});

Added $t.parent('tr').find(".parcela") will fetch the tr relative of those who modified select and then locate a parcela class element.

Since the element is created dynamically, it needs to monitor a higher element, in this case document , so any element that appears will be monitored and may have the ability to add change . ;)