帶多個提交按鈕的Ajax

如何更改下面的代碼，而不是使用提交按鈕的文本輸入類型我想要多個提交按鈕，每個提交按鈕都有自己的唯一值？我嘗試的所有事情都是以未定義的提交值爲結束。任何幫助將是偉大的！帶多個提交按鈕的Ajax

代碼源：Submit Search query & get Search result without refresh

<script type="text/javascript"> 
    $(function() { 
     $("#lets_search").bind('submit',function() { 
      var value = $('#str').val(); 
      $.post('db_query.php',{value:value}, function(data){ 
       $("#search_results").html(data); 
      }); 
      return false; 
     }); 
    }); 
</script> 

<form id="lets_search" action="" > 
    Search:<input type="text" name="str" id="str"> 
    <input type="submit" value="send" name="send" id="send"> 
</form>

來源

2012-07-28 Sam

試$（ '＃發送'）。點擊（function（）{// code here}）;和類型=「提交」insted把它作爲類型=「按鈕」 – Vamsi 2012-07-28 07:37:46

您可以添加多個提交按鈕，重視他們都onclick事件偵聽器。點擊按鈕時 - 獲取值並通過POST請求發送。

<script> 
$(function(){ 
    $('input[type=submit]').click(function(){ 
     $.post('db_query.php', {value:$(this).val()}, function(data){ 
      $("#search_results").html(data); 
     }); 
     return false; 
    }); 
}); 
</script> 
<form id="lets_search" action=""> 
    <input type="submit" name="button1" value="hi"/> 
    <input type="submit" name="button2" value="bye"/> 
</form>

來源

2012-07-28 08:18:23

這正是我用最少量的額外打字尋找的東西，謝謝！ – Sam 2012-07-28 17:04:19

-1

你可以有多個形式，沒有問題提交按鈕。他們可能有相同的名稱，類型等，但只是給他們分配不同的值。像提交按鈕1可以有價值=「嗨」和按鈕2可以有價值=「再見」。

然後，當動作函數被調用的按鈕，所有你所輸入功能時做的是做一個檢查：$ .VAL（本）

HTML: 

<input type="submit" name="button1" value="hi"/> 
<input type="submit" name="button2" value="bye"/> 

jQuery: 
$(function() { 
    $("#lets_search").bind('submit',function() { 
     var value = $(this).val(); 

     if(value == "hi") 
      do_something; 
     else 
      do_something_else; 
    }); 
});

來源

2012-07-28 07:39:06

val將在表單提交返回？我認爲你需要綁定點擊，而不是 – mplungjan 2012-07-28 08:26:17

根本不工作 – mplungjan 2012-07-28 08:41:08

-1

在這裏，我寧願Vamsi的解決方案n爲什麼不Sanjeev mk？

給出一些額外的想法，喜歡解決方案。

情況：如果多張提交按鈕

如果用戶在文本字段，並點擊回車，系統將承擔第一提交按鈕被擊中。

所以，在這裏，這將是很好的去沒有多張。如果你想使用多個提交按鈕提交的觀點

來源

2012-07-28 07:48:13

請提供沿wih -ve投票的解釋，否則它會是浪費 – 2012-07-28 07:55:31

我沒有投票下來，但我建議你將其轉換爲「請注意在多個提交按鈕的情況下：如果用戶在文本字段中並點擊輸入，則系統將假定第一個提交按鈕被擊中。「因爲你的答案是有點漫不經心，而不是回答 – mplungjan 2012-07-28 07:58:49

ok.iam通過案例研究答案回答。並不總是隻有答案是答案。 – 2012-07-28 08:05:44

終端用戶點按鈕，你可以捕捉單擊事件並確定哪個按鈕被點擊。然後運行不同的Ajax提交。這也適用於enter被擊中。

//submit buttons 
<form id="lets_search" action="" > 
    Search:<input type="text" name="str" id="str" /> 
    <input type="submit" value="v1"/> 
    <input type="submit" value="v2"/> 
    //...more submit buttons 
</form>  

//submit func 
$(function() { 
    $("#lets_search input[type=submit]").click(function() { 
     switch ($(this).val){ 
      case 'v1':...; 
      case 'v2':... 
     } 
    }); 
});

來源

2012-07-28 08:12:53 bingjie2680

爲什麼e.target？ $（this）.val（）應該已經足夠，正如sanjeev – mplungjan 2012-07-28 08:18:09

已經指出的那樣，謝謝。 – bingjie2680 2012-07-28 08:20:30

其實我覺得你的解決方案會更好，因爲你綁定按鈕點擊而不是表單提交 – mplungjan 2012-07-28 08:26:55

這裏是我的版本 - 現在看起來非常像Bingjies，因爲它是書面，而我測試了他的版本

DEMO

<form id="lets_search" action="" > 
Search:<input type="text" name="q" id="q"> 
<input type="submit" value="Google" name="send" id="google"> 
<input type="submit" value="Bing" name="send" id="bing"> 
</form> 

$(function() { 
    $("#lets_search input[type=submit]").click(function() { 
    switch ($(this).val()) { 
     case "Bing" : 
      $("#lets_search").attr("action","http://www.bing.com/search"); 
      break; 

     case "Google": 
      $("#lets_search").attr("action","https://www.google.com/search"); 
      break; 
    }   
    }); 
});

來源

2012-07-28 08:43:16 mplungjan

帶多個提交按鈕的Ajax

回答

相關問題