2015-02-08 3 views
0

Я пытаюсь создать форму, которая будет вводить пользовательский ввод для создания запроса для базы данных. У меня есть три кнопки: И, или, Запустите.Нажмите любую кнопку для отправки формы. Как остановить это?

Я создаю динамические элементы при нажатии кнопок «И» и «В». enter image description here

Адрес search_list является контейнером для хранения элементов. Мне нужна форма для отправки по клику Run.

Странно, когда я нажимаю на любую кнопку, форма отправляется. Как остановить его? Пожалуйста, дайте мне знать. Если вам нужна дополнительная информация.

Благодаря

 <html> 
     <head> 
     <script type="text/javascript"> 

      var count = 0; 
      function loadfirst(){ 
       count=1; 
       addFilter(''); 
      } 
      function addFilter(flag){ 
       var div = document.querySelector("#search_list"); 
       tr = document.createElement("tr"); 
       select = document.createElement("select"); 
       var sear_value = document.createElement("input"); 
       var and_or = document.createTextNode(flag); 
       tr.id='tr_'+count; 
       select.id='sl_'+count; 
       sear_value.id='sear_value_'+count; 

       select.options.add(new Option("user id","user_id", true,true)); 
       select.options.add(new Option("First name","first_name")); 
       select.options.add(new Option("Last name","last_name")); 
       select.options.add(new Option("Course","course")); 

       sear_value.type="text"; 

       if(count<=1){ 
        var bt_and= document.createElement("button"); 
        bt_and.id='and'; 
        var bt_label = document.createTextNode("And"); 
        bt_and.appendChild(bt_label); 
        bt_and.addEventListener('click', function() { 
         addFilter('and'); 
         return false; 
        }); 

        var bt_or= document.createElement("button"); 
        bt_or.id='or'; 
        var bt_label = document.createTextNode("Or"); 
        bt_or.appendChild(bt_label); 
        bt_or.addEventListener('click', function() { 
         addFilter('or'); 
         return false; 
        }); 
       } 
       else{ 
        var bt_rem= document.createElement("button"); 
        bt_rem.id='rem_'+count; 
        var bt_label1 = document.createTextNode("x"); 
        bt_rem.appendChild(bt_label1); 
        var tr_id = 'tr_'+count; 

        bt_rem.addEventListener('click', function() { 
        var element= document.getElementById(tr_id); 
         element.parentNode.removeChild(element); 
         return false; 
        }); 
       } 

       tr.appendChild(and_or); 
       tr.appendChild(select); 
       tr.appendChild(sear_value); 
       if(count<=1){ 
        tr.appendChild(bt_and); 
        tr.appendChild(bt_or); 
       } 
       else{ 
        tr.appendChild(bt_rem); 
       } 
       div.appendChild(tr); 

       count++; 
      } 

      function getFilter(){ 

       alert(); 

      } 




     </script> 
     </head> 

     <body onload="loadfirst()"> 

     <span id='manage_stud_header' class= 'list_header'> 

      <label><?php echo $module_name;?></label> 
      &nbsp;&nbsp; 
      <center> 
       <form> 
       <div id='search_list' class='search'></div> 
       <button id="run_filter" type="submit">Run</button> 
       </form> 
      </center> 

     </span> 
     </body> 
     </html> 

ответ

2

Тип по умолчанию для кнопок «Submit», так что вы должны явно сказать, что вы хотите простой кнопки:

var bt_and= document.createElement("button"); 
bt_and.type = "button"; 

Таким образом, он не будет представлять форму при нажатии. (Если, конечно, вы не скажете ему :))

+1

Я был таким глупым. Это была такая маленькая вещь, которую я забыл :) –

0

вы должны изменить

<button id = "run_filter" type = "submit" > Run </button> 

в

<input id = "run_filter" type = "submit" value="Run" />

, а затем, если поведение щелчка на кнопке является принудительно перезагрузить страницу, попробуйте изменить кнопку на другом элементе формы или увидеть e.preventdefaulT jQuery

Смежные вопросы