首页 > 解决方案 > 动态 jQuery 表单中的相同值

问题描述

您好,该网站的所有用户,我的目的是为多个产品与同一客户的多重关联创建一个动态表单,我有想法在 jquery 能够创建动态表单的帮助下实现它,所以在网上看,我在 jsFiddle 上遇到了一个例子,它工作得很好。我唯一需要的不是有一个可以写入的空输入,而是一个具有固定值的输入。例如单词“TEST”,每次生成新的输入时,生成的输入总是有值=“TEST”。我该怎么做?

代码(您可以复制并粘贴到您的 test.html 中,它可以工作!):

<head>
    <script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.min.js"></script>
</head>

<form role="form" action="/wohoo" method="POST">
    <label>impianti</label>
    <div class="CLASSE_DA_SPECIFICARE-VARIABILE_DA_INZIALIZZARE">
        <div class="CLASSE_DEL_DIV">
            <div class="CLASSE_DA_SPECIFICARE">
                <input type="text" name="impianti[]">
                <input type="text" name="impianti[]">
                <button type="button" class="RIMUOVI_INPUT">Remove</button>
            </div>
        </div>
        <button type="button" class="add-field">Add field</button>
    </div>
</form>

<script type="text/javascript">
    $('.CLASSE_DA_SPECIFICARE-VARIABILE_DA_INZIALIZZARE').each(function () {
        var $VARIABILE_DA_INZIALIZZARE = $('.CLASSE_DEL_DIV', this);
        $(".add-field", $(this)).click(function (e) {
            $('.CLASSE_DA_SPECIFICARE:first-child', $VARIABILE_DA_INZIALIZZARE).clone(true).appendTo($VARIABILE_DA_INZIALIZZARE).find('input').val('').focus();
        });
        $('.CLASSE_DA_SPECIFICARE .RIMUOVI_INPUT', $VARIABILE_DA_INZIALIZZARE).click(function () {
            if ($('.CLASSE_DA_SPECIFICARE', $VARIABILE_DA_INZIALIZZARE).length > 1)
                $(this).parent('.CLASSE_DA_SPECIFICARE').remove();
        });
    });
</script>

如何放入.val()<?php echo $row['impianto_id'] ;?>

我有这个:

<?php
session_start();
include 'connessione.php';
$id = $_SESSION['id'];
$query_string = "SELECT * FROM impianti";
$impianti = mysqli_query($connessione, $query_string);
?>

<h4>IMPIANTO ID CAMPAGNA</h4>
<select name="impianto_id_campagna">
    <?php
    while ($row = mysqli_fetch_assoc($impianti)) { ?>
        <option value="<?php echo $row['impianto_id']; ?>">
            <?php echo $row['concessionaria']; ?>
        </option>
    <?php } ?>
</select>

我想在 .val() 中回显这个

但它不起作用......

<head>
<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.min.js"></script>
</head>

<form role="form" action="/wohoo" method="POST">
    <label>impianti</label>
    <div class="CLASSE_DA_SPECIFICARE-VARIABILE_DA_INZIALIZZARE">
        <div class="CLASSE_DEL_DIV">
            <div class="CLASSE_DA_SPECIFICARE">
                <input type="text" name="impianti[]">
                <input type="text" name="impianti[]">
                <button type="button" class="RIMUOVI_INPUT">Remove</button>
            </div>
        </div>
        <button type="button" class="add-field">Add field</button>
    </div>
</form>

<script type="text/javascript">
    var impianto_id = '<?php $row[' impianto_id ']; ?> ';
    console.log (impianto_id);
</script>

<script type="text/javascript">
$('.CLASSE_DA_SPECIFICARE-VARIABILE_DA_INZIALIZZARE').each(function () {var $VARIABILE_DA_INZIALIZZARE = $('.CLASSE_DEL_DIV', this);
$(".add-field", $(this)).click(function (e) {
$('.CLASSE_DA_SPECIFICARE:first-child', $VARIABILE_DA_INZIALIZZARE).clone(true).appendTo($VARIABILE_DA_INZIALIZZARE).find('input').val(impianto_id).focus();
});
$('.CLASSE_DA_SPECIFICARE .RIMUOVI_INPUT', $VARIABILE_DA_INZIALIZZARE).click(function () {
if ($('.CLASSE_DA_SPECIFICARE', $VARIABILE_DA_INZIALIZZARE).length > 1)
$(this).parent('.CLASSE_DA_SPECIFICARE').remove();
});
});
</script>

标签: javascriptjquery

解决方案


$('.CLASSE_DA_SPECIFICARE-VARIABILE_DA_INZIALIZZARE').each(function() {

var $VARIABILE_DA_INZIALIZZARE = $('.CLASSE_DEL_DIV', this);

$(".add-field", $(this)).click(function(e) {

$('.CLASSE_DA_SPECIFICARE:first-child', $VARIABILE_DA_INZIALIZZARE).clone(true).appendTo($VARIABILE_DA_INZIALIZZARE).find('input').val('TEST').focus();});// here the test

$('.CLASSE_DA_SPECIFICARE .RIMUOVI_INPUT', $VARIABILE_DA_INZIALIZZARE).click(function() {

if ($('.CLASSE_DA_SPECIFICARE', $VARIABILE_DA_INZIALIZZARE).length > 1)

$(this).parent('.CLASSE_DA_SPECIFICARE').remove();

});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>


<form role="form" action="/wohoo" method="POST">

<label>impianti</label>

<div class="CLASSE_DA_SPECIFICARE-VARIABILE_DA_INZIALIZZARE">

<div class="CLASSE_DEL_DIV">

<div class="CLASSE_DA_SPECIFICARE">

<input type="text" name="impianti[]">

<input type="text" name="impianti[]">

<button type="button" class="RIMUOVI_INPUT">Remove</button>

</div>

</div>

<button type="button" class="add-field">Add field</button>

</div>

</form>

您所要做的只是将“测试”添加到您创建的输入的 .val() 中。


推荐阅读