如何使html按钮以php中的特定数组索引为目标? [英] How to make a html button target a specific array index in php?

问题描述

我正在处理 html/php 代码，如下所示.在其中点击html代码中的按钮，它进入php中Line#B的foreach块内.

I am working on a html/php code as shown below. In it on click of a button from html code, it goes inside foreach block at Line#B in php.

<?php 
     $mp4_files = array_values($mp4_files); 
     print_r($mp4_files);  // Line #A
     if($_SERVER['REQUEST_METHOD'] == "POST")
    {       
     foreach ($mp4_files as $f)  // Line#B
     { 
            // conversion of mp4 into mp3 is happening, not pasting the full code. 
     }
    }
?> 

<form action="" method="POST">
 <table>
       <tr>
          <th>MP4 Name</th>
          <th>Action</th>
       </tr>
      <?php
        $mp4_files = array_values($mp4_files);
        foreach ($programs as $key => $program)  { 
       $file = $mp4_files[$key];     
       print_r($file);   // Line#B
       ?> 
       <tr>
          <td><?php echo basename($file); ?></td>
          <td><button type="submit" name="go-button" value="Go">Go</button</td>
       </tr>
   <?php } ?>
</table>
</form>

上面的html/php代码显示以下内容:

The above html/php code display the following content:

在上面的屏幕截图中，我们列出了带有相应按钮的mp4文件.

In the screenshot above, we have list of mp4 files with their respective buttons.

Line#A从上面的html/php代码中打印以下数组:

Array ( [0] => 36031P.mp4 [1] => hello.mp4 ) 

和行#B:

36031P.mp4 hello.mp4

此刻，单击任意表行中的转到"按钮，开始将所有mp4文件转换为mp3 (这不是我的要求)

At this moment, on click of a Go button from any table row, conversion of all mp4 files into mp3 start happening (which is not my requirement)

问题陈述:

我想知道我应该在上面的html/php代码中进行哪些更改，以便如果我单击屏幕快照中上面第一行中的 Go按钮，应该先将第一行的mp4文件转换为mp3，反之亦然

I am wondering what changes I should make in the html/php code above so that if I click on Go button from 1st row above in the screenshot, conversion of 1st row mp4 file into mp3 should start happening and vice-versa

推荐答案

您可以使用数据标签来实现此目的(代码只是示例说明点):

You can use data-tags to achieve this (code is just example demonstrating point):

PHP/HTML

PHP / HTML

<?php foreach ($files as $key => $file) : ?>
    <tr>
        <td>
            <span class="file-name" data-id="<?php echo $key; ?>">
                <?php echo basename($file); ?>
            </span>
        </td>
        <td>
            <button type="submit"
                    class="go-btn"
                    name="go-button"
                    value="Go"
                    data-id="<?php echo $key; ?>"  >
                Go
            </button
        </td>
    </tr>
<?php endforeach; ?>

JavaScript(jQuery)

JavaScript (jQuery)

jQuery(document).ready(function($)
{
    $('.go-btn').click(function(e)
    {
        //pass in e(vent) to prevent the default behaviour of type="submit"
        e.preventDefault();

        let target = $(this).attr('data-id'),
            spanEl = $('.file-name[data-id='+ target +']');
        //do whatever with the spanEl - e.g. .text() to get value

        //send the file / ID - depending on how you're retrieving these files
        $.ajax({
            data: {key: 'value'}, //change to what you want
            type: 'post',
            url: '/path/to/script.php',
            success: function(res)
            {
                alert(res)
            },
            error: function(res)
            {
                //log the response for debugging
                console.log(res);

                //tell the user it failed
                alert('The dark elves have been here.. they broke it!')
            }
        })
    })
});

script.php

script.php

<?php
    # worth nothing that if you're posting a file (with intention of using $_FILES)
    # that you need to change your ajax, add `processData: false, contentType: false, cache: false`
    # and add `enctype="multimedia/form-data"` as an attribute to your form
    $value = $_POST['key']; # key: = index name

    # run conversion on the file
    # here we can add a success/error msg
    echo ($success ? 'It converted!' : 'Conversion failed');

到此为止，您应该具有类似于(或至少我会这样做)的文件结构:

By the end of this, you should have a file structure similar to (or at least I'd do it this way):

Project_Root
----app
--------convert.php
----index.php
----pub
--------js
------------main.js

这篇关于如何使html按钮以php中的特定数组索引为目标?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！