如何在同一個html表單中爲不同的提交按鈕分配不同的動作？

Question

我想根據不同的提交按鈕分配不同的動作到相同的HTML表單。

我可以這樣做嗎？

<FORM> 
------ 
<INPUT type="submit" value="DoSomething" action="DoSomething.pl" method="POST"> 
<INPUT type="submit" value="DoSomethingElse" action="DoSomethingElse.pl" method="POST"> 
<FORM/> 

Answer 1

號公報形式只有一個action（action作爲form的屬性，而不是提交按鈕）。

動作的目標可以根據表單中的值做不同的事情。所以，你可能想要開始命名你的提交按鈕。

在您考慮編寫和部署CGI腳本之前，請先學習HTML。

<form method="POST" action="/cgi-bin/script"> 
<input type="submit" name="action" value="DoSomething"> 
<input type="submit" name="action" value="DoSomethingElse"> 
</form> 

還要注意選擇基於提交按鈕的值的行動是一個失敗的策略，如果你希望國際化的應用程序，因爲一個提交按鈕的value是什麼UA展示給人類。

因此，script應該根據其他輸入元素的值決定如何處理。

例如，CGI::Application查看run_mode參數。

或者，您可以使用不同的名稱作爲您的提交按鈕，如亞歷克所示。在這種情況下，您需要通過查看傳遞給腳本的參數名稱來檢查哪個提交按鈕被按下了，恕我直言，這會使調度變得更加麻煩。這也意味着它可能是有人將值傳遞所有提交按鈕，您的腳本（不通過用戶界面，但通過curl或wget或類似的計劃。

例如，給出的HTML

<form method="POST" action="/cgi-bin/script"> 
<input type="submit" name="submit_left" value="Go Left"> 
<input type="submit" name="submit_right" value="Go Right"> 
</form> 

這裏是你的腳本可以如何處理表單提交：

#!/usr/bin/perl 

use strict; use warnings; 

use CGI::Simple; 

my $cgi = CGI::Simple->new; 

my %dispatch = (
    left => \&handle_left, 
    right => \&handle_right, 
); 

my @actions = grep s/^action_(right|left)\z/$1/, $cgi->param; 

my $handler = \&handle_invalid_action; 

if (@actions == 1) { 
    my ($action) = @actions; 
    if (exists $dispatch{ $action }) { 
     $handler = $dispatch{ $action }; 
    } 
} 
else { 
    $handler = \&handle_too_many_actions; 
} 

$handler->($cgi); 

sub handle_left { } 
sub handle_right { } 
sub handle_invalid_action { } 

# because it may indicate someone trying to abuse your script 
sub handle_too_many_actions { } 

Answer 2

萬一別人發現這個帖子：

我如果您使用的是HTML5，現在可以使用formaction屬性更容易了。此屬性適用於input和button元素type="submit"，並強制該表單提交到點擊元素的formaction屬性中指定的位置。

然後只有這個屬性的缺點是它不被Internet Explorer 9和更低版本支持，但是這個限制可以通過使用一點JavaScript輕鬆解決。

例子：

<form method="post" action="go_default"> 
    <input type="submit" value="Go Left" formaction="go_left" /> 
    <input type="submit" value="Go Right" formaction="go_right" /> 
</form> 

對於IE 9，下：

<script type="text/javascript"> 
    $(function() { 
     var $submit = $('form [type="submit"][formaction]'); 

     $submit.click(function() { 
      var $this = $(this), 
       action = $this.prop('formaction'), 
       $form = $this.closest('form'); 

      $form.prop('action', action).submit(); 
     }); 
    }); 
</script> 

Answer 3

你也可以使用Ajax對於這一點，每一個按鈕分配調用一個Ajax功能它自己PHP腳本，你甚至不需要刷新頁面或重定向，就像我嘗試過的這個例子：

HTML: 
<input type="submit" value="Make other thing" onclick="ajax_post1();"/> 
<input type="submit" value="Make something" onclick="ajax_post2();"/> 

<div id="script1Response"></div> 
<div id="script2Response"></div> 

Javascript函數：

//第一功能

function ajax_post1(){ 
var hr = new XMLHttpRequest(); 

//從您要使用

var v1=document.getElementbyId("element1").value; 
var v2=document.getElementbyId("element2").value; 

//腳本的HTML輸入元素取值是將處理數據

var url="php_script1.php"; 

//將包含爲PHP腳本

var dataVar="var1="+v1+"&var2="+v2; 
hr.open("POST", url, true); 
hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); 

的信息的變量//進入onreadystatechange事件的XMLHttpRequest對象

hr.onreadystatechange = function() { 
    if(hr.readyState == 4 && hr.status == 200) { 
    var script_response = hr.responseText; 
    document.getElementById("script1Response").innerHTML = script_response; 
    } 
    } 

//發送數據到php_script1.php

hr.send(dataVar); // Actually execute the request 
document.getElementById("script1Response").innerHTML = "processing..."; 
} 

//第二功能

function ajax_post2(){ 

var v1=document.getElementbyId("element1").value; 
var v2=document.getElementbyId("element2").value; 
var url="php_script2.php"; 
var dataVar="var1="+v1+"&var2="+v2; 
var hr = new XMLHttpRequest(); 
hr.open("POST", url, true); 
hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); 

hr.onreadystatechange = function() { 
    if(hr.readyState == 4 && hr.status == 200) { 
    var script_response = hr.responseText; 
    document.getElementById("script2Response").innerHTML = script_response; 
    } 
    } 

hr.send(dataVar); 
document.getElementById("script2Response").innerHTML = "processing..."; 

} 

個

PHP文件必須包含一些變量，將存儲由dataVar參數這樣發送的值：

$var1_=$_POST['var1']; //the var1 from the dataVar parameter 
$var2_=$_POST['var2']; //the var2 from the dataVar parameter 

我使用的例子可以在這裏找到： https://www.youtube.com/watch?v=woNQ2MA_0XU。