samedi 11 février 2017

jQuery Add / Remove Textbox

<script type="text/javascript">
    $(document).ready(function(){

        var counter = 2;

        $("#addButton").click(function () {

        if(counter<2){
                alert("Add more textbox");
                return false;
        }

        var newTextBoxDiv = $(document.createElement('div'))
             .attr("id", 'TextBoxDiv' + counter);

        newTextBoxDiv.after().html('<label>Textbox #'+ counter + ' : </label>' +
              '<input type="text" name="textbox' + counter +
              '" id="textbox' + counter + '" value="" >' +
              '<input type="button" name="button' + counter +
              '" id="removeButton' + counter + '" value="Remove Button">');
        newTextBoxDiv.appendTo("#TextBoxesGroup");


        counter++;
         });

          **$("#removeButton").click(function () {

             $("#TextBoxDiv" + counter).remove();

        if(counter==2){
              alert("No more textbox to remove");
              return false;
     }**


         });


      });
    </script>
    </head><body>

    <div id='TextBoxesGroup'>
        <div id="TextBoxDiv1">
            <label>Textbox #1 : </label><input type='textbox' id='textbox1'><input type='button' value='Remove Button' id='removeButton'>
        </div>
    </div>
    <input type='button' value='Add Button' id='addButton'>

1:i need to make the delete button to be functional. when i pressed the corresponding button on the side only the textbox beside it will only remove.:i need to make the delete button to be functional. when i pressed the corresponding button on the side only the textbox beside it will only remove.:i need to make the delete button to be functional. when i pressed the corresponding button on the side only the textbox beside it will only remove.:i need to make the delete button to be functional. when i pressed the corresponding button on the side only the textbox beside it will only remove.

Aucun commentaire:

Enregistrer un commentaire