单击提交按钮时如何传递被单击按钮的值？

Question

我有一个带有多个按钮和一个提交按钮的HTML表单。 我试图传递在单击“提交”按钮之前被单击的按钮的值。 该程序的主要功能是在相应表中上传一个csv文件，该文件具有与按钮相同的名称，即表的名称与按钮值相同。 因此，传递的值将在后续的php页面的mysql查询中使用。

我尝试使用php post这样的方法：

if(isset($_POST['submit'])){
$_POST['buttonname'];
} 

index.php

<form id="upload_csv" method="GET" enctype="multipart/form-data">

<button type="button" id="button1" name = "button1" 
value="role">Role</button>
<button type="button" id="button2" name = "button1" 
value="report">Report</button>
<button type="button" id="button3" name = "button3">Brand</button>

  <!-- uploading the csv file here -->
 <input type="file" name="employee_file" style="margin-top:15px;" /> 

 <input type = "submit" value="submit" name="submit">
 </form>


<!-- ajax code to upload csv -->

  <script>
  $(document).ready(function(){  
  $('#button1,#button2,#button3').click(function(){
  $('#upload_csv').on("submit", function(e){  
   e.preventDefault(); 

            $.ajax({  
                 url:"import.php",  
                 method:"POST",  
                 data:new FormData(this),  
                 contentType:false,         
                 cache:false,                
                 processData:false,          
                 success: function(data){  

                          alert("Data updated successfully");  

                 }  
            })  
       });
           });
   });

</script>

因此，首先，仅在其中一个按钮被单击之前，提交按钮才应发布。 如果单击了按钮，然后单击了提交按钮，则该单击的按钮的值将传递到下一页。 例如，如果单击第一个按钮，则应传递值“ role”。

Answer 1

您可以为此使用ajax和jquery ，即：按钮的onclick获取其值，然后通过使用ajax将单击的按钮值提交到php页面的onclick提交，例如：

 //on click of button get value $("button").on("click", function() { //getting button click value var value = $(this).val(); console.log(value); $("input[name='submit']").click(function(e) { e.preventDefault(); console.log(value); //calling ajax $.ajax({ type: "POST", url: "yourphppage", data: { 'value': value //<-passing value to php }, success: function(response) { //display something alert(response); }, error: function(jqXHR) { alert("There was a problem"); } }); }); }); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.0/jquery.min.js"></script> <form method="post"> <button type="button" id="button1" name="button1" value="role">Role</button> <button type="button" id="button2" name="button1" value="report">Report</button> <button type="button" id="button3" name="button3" value="brand">Brand</button> <input type="submit" value="submit" name="submit"> </form> 

然后在php页面中get value按钮的get value ，如下所示：

if(isset($_POST['value'])){
echo $_POST['value'];
} 

更新1：

---

尝试如下，我已经使用append将键/值追加到formData 。 即：

 $(document).ready(function() { $('button').click(function() { //getting button click value var value = $(this).val(); console.log(value); $('#upload_csv').on("submit", function(e) { e.preventDefault(); //creating object for form var formData = new FormData(); //appenfing data for button value formData.append('values', value); //append file formData.append('files', $('input[type=file]')[0].files[0]); $.ajax({ url: "import.php", method: "POST", data: formData, contentType: false, cache: false, processData: false, success: function(data) { alert("Data updated successfully"); } }) }); }); }); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <form id="upload_csv" method="GET" enctype="multipart/form-data"> <button type="button" id="button1" name="button1" value="role">Role</button> <button type="button" id="button2" name="button1" value="report">Report</button> <button type="button" id="button3" name="button3" value="brand">Brand</button> <!-- uploading the csv file here --> <input type="file" name="employee_file" style="margin-top:15px;" id="myFileInput" /> <input type="submit" value="submit" name="submit"> </form>