php如何将其他选定项添加到数组

Question

I am having problems with a list box that is set to multiple. 我在将列表框设置为多个时遇到问题。

My setup is 3 individual list boxes, Categories(single select), Jobs(single select), and Tasks(multiple select) When a users selects one item in Categories an ajax request populates the Jobs list box. 我的设置是3个单独的列表框，类别（单选），作业（单选）和任务（多选）当用户在“类别”中选择一项时，Ajax请求将填充“作业”列表框。 when a user selects one item from Jobs an ajax request populates the tasks box with one or more pre-selected items, plus the un-selected items. 当用户从Jobs中选择一项时，Ajax请求会在任务框中填充一个或多个预选项目以及未选项目。

All this works well my problem araises when I try to select additional items in tasks the pre selected items clear. 当我尝试在预选项目清除的任务中选择其他项目时，所有这些都很好地解决了我的问题。 I need the pre selected items to remain selected and be able to select additional items. 我需要预先选择的项目才能保持选中状态，并且能够选择其他项目。 I am using a function to select the additional item and refresh the tasks list box so that I do not have to press ctrl when selecting an item. 我正在使用一个函数来选择其他项目并刷新任务列表框，以便在选择项目时不必按Ctrl键。

Here is my html 这是我的html

<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title></title>
<script type="text/javascript" src="js/jquery-1.11.2.js"></script>
<?php
  session_start();
  include('dbcon/dbconnect.php');
  $con=mysqli_connect($host,$user,$password,$db);
?>
<script> 
function getSelectedItems(){
    var items = "";
    var frm = document.forms[0].s1;
    var len = frm.length;
    for(i=0;i<len;i++){
        if(frm[i].selected){
            items += frm[i].value + "~";
        }
    }
    alert(items);
}
$(document).ready(function(){
    $("select#cat").change(function(){
        var cat_id =  $("select#cat option:selected").attr('value'); 
        $("#job").html( "" );
        if (cat_id.length > 0 ) { 
            parent.top.$("#jobbtn").val("Change Category");
            $.ajax({
                type: "POST",
                url: "fetch_jobs.php",
                data: "cat_id="+cat_id,
                cache: false,
                beforeSend: function () { 
                    $('#job').html('<img src="loader.gif" alt="" width="24" height="24">');
                },
                success: function(html) {    
                    $("#job").html( html );
                }
            });
        }
    });
    $("select#job").change(function(){
        var job_id =  $("select#job option:selected").attr('value');
        invid = 0; 
        $("#task").html( "" );
        if (job_id.length > 0 ) { 
            $.ajax({
                type: "GET",
                url: "1a.php",
                data: "job_id="+job_id+"&invid="+invid,
                cache: false,
                beforeSend: function () { 
                },
                success: function(html) {    
                    $("#task").html( html );
                    var selected = $("#task").val();
                }
            });
        }

    });
});
function getnotes(){

} 
</script>
</head>
<body>
<form id="form1"  >    
<select id="cat" size="12" style='font-style:arial;font-size:14px;'>
<?php
$result = mysqli_query($con, "SELECT CatID, Catagory FROM catagory ORDER BY Catagory");
while($row = mysqli_fetch_array($result))
{ 
  echo "<option value=\"".$row['CatID']."\">".$row['Catagory']."</option>\n  ";
}
echo "</select>";
echo "<Div style='position:absolute;left:70px;top:0px;width:25px;z-index:1014;text-align:center;'>";
echo "<span id='jobl' style='position:fixed;left:180px;top:3px;font-family:Arial;font-size:15px;background-color:#FF9933 ;width:340px;height:20px;'>Jobs</span></div>";
echo "<select name='job' id='job' size='12' style='position:fixed;left:180px;top:23px;width:340px;font-size:14px;font-family:Arial;' onchange='' >";
echo "<option value='' ></option>";
echo "</select>";

echo "<Div style='position:absolute;left:70px;top:px;width:25px;z-index:1014;text-align:center;'>";
echo "<span id='taskl' style='position:fixed;left:535px;top:3px;font-family:Arial;font-size:15px;background-color:#FF9933;width:335px;height:20px;'>Tasks</span></div>";
echo "<select name='task' id='task' size='12' style='position:fixed;left:535px;top:23px;width:335px;font-size:14px;font-family:Arial;' onchange='getnotes()' multiple>";
echo "<option value='' ></option>";
echo "</select>";
echo "<input type='submit' id='taskb' name='taskb' style='position:fixed;top:330px;left:700px;width:150px;height:60px;font-size: 22px;font-weight: bold;white-space:normal;background:Lime;' value= 'Add Task->' onclick='shofinal();'></form></div>";
echo "</form>";
?>
<script>
(function() {
    var selected = {};
    $('select#task').click(function(e) {
        var $this = $(this),
            options = this.options,
            option,
            value,
            n;

        // Find out what option was just added
        value = $this.val();

        // Re-apply the selections
        for (n = 0; n < options.length; ++n) {
            option = options[n];
            if (option.value == value) {
                // The one being updated
                selected[value] = !selected[value];
            }

            // One of the others
            option.selected = !!selected[option.value];
        }
    });
})();
 </script>
</body>
</html>

I believe my problem is in the script at the end of the html but I am unsure of what to change to fix this. 我相信我的问题出在html末尾的脚本中，但是我不确定要进行哪些更改以解决此问题。

Answer 1

I have finally gotten this worked out thought I would post what fixed it for others to see/use 我终于弄明白了，以为我会把修复它的内容发布给其他人查看/使用

I added this jquery to the $(document).ready(function() and now pre selected items stay selected and newly selected items are selected or if I click an item that is already selected it becomes unselected. I am pretty sure I understand what is happening here though I can not put it into words. But it works and I guess that is whats important. 我将此jQuery添加到$（document）.ready（function（）中，现在预选项目保持选中状态，而新选择的项目被选中，或者如果我单击已选择的项目，则该项目变为未选中状态。虽然我无法用语言说出来，但是它确实有效，我想那很重要。

I also removed the script from the end of the original html and everything is good so far. 我还从原始html的末尾删除了该脚本，到目前为止一切都很好。

Works in FF 在FF工作

 window.onmousedown = function (e) {
var el = e.target;
if (el.tagName.toLowerCase() == 'option' && el.parentNode.hasAttribute('multiple')) {
    e.preventDefault();

    // toggle selection
    if (el.hasAttribute('selected')) el.removeAttribute('selected');
    else el.setAttribute('selected', '');

    // hack to correct buggy behavior
    var select = el.parentNode.cloneNode(true);
    el.parentNode.parentNode.replaceChild(select, el.parentNode);
}
}

php如何将其他选定项添加到数组

问题描述

1 个解决方案

解决方案1
0 2016-02-25 16:49:53

php如何将其他选定项添加到数组

问题描述

1 个解决方案

解决方案1 0 2016-02-25 16:49:53

解决方案1
0 2016-02-25 16:49:53