как вставить новое поле input в указанный код?

Тема в разделе "JavaScript", создана пользователем anz, 16 июл 2012.

Модераторы: ZiX
  1. anz

    anz Level XXL

    Регистр.:
    17 окт 2006
    Сообщения:
    935
    Симпатии:
    304
    ниже код, в нем из двух раскрывающихся списков вносятся данные в input, как правильно вставить новое поле input для ручного ввода данных если их нет в раскрывающемся списке (тоесть в ручную заполнить поле <input name="sel" id="sel" type="hidden" value="{$art.model}" />)
    Код:
    $("#vendor").change(function () {
              var model = "";
              $("#vendor option:selected").each(function () {
                    model = $(this).val();
                  });
                if(model != 0)
                {
                    //отправка скрипту
                    var sel= $("#sel").val();
                    $("#model").attr("disabled", "disabled");
                    $.post("/ajax/model.php", {value : model, sel: sel}, function(data) {
                        $("#vendor").attr("disabled", "");
                        $("#model").attr("disabled", "");
                        $("#model").html(data);
                    });
                } else
                {...
     
     
    <table class="proptable">
        <tr>
            <td>Артикул:</td>
            <td><select name="vendor" id="vendor" style="width: 225px;">{$vendors}
              </select></td><td>&nbsp;</td>
            <td>Модель:</td>
            <td><input name="sel" id="sel" type="hidden" value="{$art.model}" />
            <select id="model" name="model" style="width: 225px;">Модель
            </select>
            </td>
        </tr>
    </table>
    
    заранее благодарен.
     
  2. dino

    dino

    Регистр.:
    28 май 2009
    Сообщения:
    550
    Симпатии:
    204
    такой скрипт на базе jquery добавит после вашей таблицы такой input какой вам нужно и в неограниченном количестве
    Код:
     
    $("#open_div").click(function(){$("#div_new_input").fadeIn("slow");});
    $("#send").click(function(){
    $("#open_div").before("<input type='"+ $("#type").val() +"' name='"+ $("#name").val() + "' id='" + $("#id").val() + "' value='" + $("#value").val() + "'><br>");
    $("#type").val("");
    $("#name").val("");
    $("#id").val("");
    $("#value").val("");
    $("#div_new_input").fadeOut("slow");
    });
     
    
    собственно Ваша табличка + необходимая дополнительная разметка
    HTML:
    <table class="proptable">
        <tr>
            <td>Артикул:</td>
            <td><select name="vendor" id="vendor" style="width: 225px;">{$vendors}
              </select></td><td>&nbsp;</td>
            <td>Модель:</td>
            <td><input name="sel" id="sel" type="hidden" value="{$art.model}" />
            <select id="model" name="model" style="width: 225px;">Модель
            </select>
            </td>
        </tr>
    </table>
    <input type="button" value="add_new_input" id="open_div">
    <div style="display:none" id="div_new_input">
    type: <input type="text" id="type"><br>
    name: <input type="text" id="name"><br>
    id: <input type="text" id="id"><br>
    value: <input type="text" id="value"><br>
    <input type="button" id="send" value="create_input">
    </div>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​ ​​​​​​​​​​​​​​​​​​​​​
    Скрипт простейший, без каких либо проверок введенных данных! Вставлять input, в принципе, можно куда угодно, нужно просто указать в строке: $("#open_div").before( ... вместо #open_div данные элемента перед каким нужно сделать вставку. Если хотите сделать вставку после какого то элемента DOM структуры документа, то нужно заменить before на after
     
    anz нравится это.
  3. anz

    anz Level XXL

    Регистр.:
    17 окт 2006
    Сообщения:
    935
    Симпатии:
    304
    спасибо за ответ, но я скорее всего не понятно написал...

    в таблице есть поле: <input name="sel" id="sel" type="hidden" value="{$art.model}" /> - которое заполняется выбором данных из двух раскрывающихся списков,
    но нужна дополнительная возможность заполнить это поле вручную.

    как вставить поле по типу <input name="" id="" type="text" value="" />, что бы данные с этого поля записались в базу.

    теоретически понимаю, что данные с поля нужно передать скрипту, но как?
     
  4. dino

    dino

    Регистр.:
    28 май 2009
    Сообщения:
    550
    Симпатии:
    204
    сделайте еще один блок (по аналогии с моим) только оставьте там те поля которые вы хотите изменить в вашем <input name="sel" id="sel" type="hidden" value="{$art.model}" /> скрипт будет приблизительно такой:
    Код:
    $("#create_input").click(function(){$("#sel").val($("#value").val()); });
    
    если вы хотите, чтоб можно было создать новый инпут и он ещё и записался в базу, то прийдется попотеть...
    во первых нужно создать скрипт как я описал в предыдущем посте, во вторых все данные которые вы хотите писать в базу, нужно обернуть в конструкцию <form action="..." method="...">.... </form> добавить кнопку отправки формы, в файле обработчике нужно сделать проверку принятых данных на наличие полей в базе, если какого либо поля не существует - то создать такое поле и только потом записать полученные данные в базу...
     
  5. anz

    anz Level XXL

    Регистр.:
    17 окт 2006
    Сообщения:
    935
    Симпатии:
    304
    а что в обработчик полей дописать? без этого не работает дополнительное поле при ручном заполнении.

    сам скрипт у меня рабочий, я привел часть кода который отвечает за обработку нужного мне поля.
     
  6. mariner

    mariner Писатель

    Регистр.:
    16 июл 2012
    Сообщения:
    3
    Симпатии:
    0
    Динамическая вставка поля с одним name. А в обработчике уже делаешь выборку.