获得几个PhP生成复选框的结果，并仅显示下面的已检查复选框

please excuse my lack of understanding but I am new to PhP. I have been told this is a simple task to do, but it is only simple when you know how and I simply don't know how.

请原谅我缺乏理解,但我是PhP的新手。我被告知这是一项简单的任务,但只有当你知道如何而且我根本不知道怎么做时,这很简单。

Basically I have a series of checkboxes generated for items within a simple SQL database. Here is the PhP code:

基本上我为一个简单的SQL数据库中的项目生成了一系列复选框。这是PhP代码:

      <select id="multi-select1" multiple="multiple">
            <?php
                //The query asking from our database
                $areaCodeSQL = "SELECT ac.Number AS `AreaCode`, ac.Name AS `AreaName`
                                FROM `AreaCodes` ac";                                                               //SQL query: From the table 'AreaCodes' select 'Number' and put into 'AreaCode', select Name and put into 'AreaName'

                $areaCodeResults = $conn->query($areaCodeSQL);                                                      // put results of SQL query into this variable

                if ($areaCodeResults->num_rows > 0) {                                                               // if num_rows(from $results) is greater than 0, then do this:
                    // output data of each row
                                foreach($areaCodeResults as $areaCodeResult)                                        //for each item in $areCodeResults do this:
                                    {
                                        $areaNameAndCode =  $areaCodeResult['AreaCode'] ." ". $areaCodeResult['AreaName'];  //get AreaCode and AreaName from query result and concat them
                                        $areaName = $areaCodeResult['AreaName'];                                    // get AreaName
                                        $areaCode = $areaCodeResult['AreaCode'];                                    //get AreaCode

                                        ?><option class="menuoption1" name="menuAreaCode" value="<?php echo $areaCode ?>"><?php echo $areaNameAndCode; ?></option><?php  //Create this option element populated with query result variables
                                    }
                }                    
            ?>
        </select>

Now I believe I can write a jQuery script like this to show the $areaCode variable in a called "showResults":

现在我相信我可以写一个像这样的jQuery脚本来显示一个名为“showResults”的$ areaCode变量:

 <script>
    function myFunction() {
        document.getElementById("showResults").text = "<?php echo $areaCode ?>";
    }

    $("menuoption1").each(myFunction());

</script>

But it doesn't and I don't know why. Could someone help?

但它没有,我不知道为什么。有人可以帮忙吗?

3 个解决方案

#1

You cannot use PHP code in JavaScript. The first is executed on the server, the second (in this case) in the browser.

您不能在JavaScript中使用PHP代码。第一个在服务器上执行,第二个(在本例中)在浏览器中执行。

I suppose you want to show the selected area code in a DOM element with the Id "showResults" (which could be a <div>).

我想你想用Id“showResults”(可能是

)在DOM元素中显示所选区域代码。

You should then register an event handler on change of the select box:

然后,您应该在更改选择框时注册事件处理程序:

$("#multi-select1").on("change", function () {
    $("#showResults").text($(this).val());
});

See https://jsfiddle.net/sqo9x42k/

#2

It seems that you're jQuery selectors aren't correct. Change

看来你的jQuery选择器不正确。更改

$("menuoption1").each(myFunction());

$(".menuoption1").each(myFunction());

Note the "."

注意“。”

More information about selectors: https://api.jquery.com/category/selectors/

有关选择器的更多信息:https://api.jquery.com/category/selectors/

#3

If your goal is to display the selected options using jQuery, you could use this:

如果你的目标是使用jQuery显示所选选项,你可以使用:

<script>
$(document).ready(function() {
    $(".menuoption1 option:selected").each(myFunction);
});
function myFunction() {
    $("#showResults").append($(this).val() + '<br>');
}
</script>
<form>
<select name="zob" class="menuoption1" multiple>
<option value="234">uyt</option>
<option value="422" selected>qdwd</option>
<option value="2">iyti</option>
<option value="345" selected>tbb</option>
</select>
</form>

See jsFiddle: https://jsfiddle.net/ahh02dsv/

见jsFiddle:https://jsfiddle.net/ahh02dsv/

#1