Question

我很难想如何保存从复选框中获取的值（来自＆＃34; modalForm＆＃34;）。我这里有2个表格。我和＃34;主要形式＆＃34;和＆＃34; modalForm＆＃34;。

此代码与我的程序类似，我只是替换值。

我的程序就像这样。我之前有一个搜索栏，搜索唯一的ID，搜索后，他们的详细信息将被加载到这里。

如果单击文本框，将弹出一个包含复选框的模式。如果选中一个复选框，则其旁边的标签将是文本框中显示的标签。当选中两个或更多复选框时，单词＆＃34; multiple＆＃34;将在UI中显示。值将被插入/更新到数据库。

在我的情况下，而不是标签，值是显示在文本框上的值。

你能帮我解决一下如何将我用过的数组存储到数据库中，以及如何在重新加载后获取它们的值。

我的工作小提琴：https://jsfiddle.net/8bf3vjuk/

我在这里度过了难关，因为这里有两种形式。

testing.php

<form method="post" name="mainform" action="">
    <label>Sports</label>
    <a href="#modal" id="done"> <!-- when the input textbox was clicked, modal will pop up -->
        <input disabled type="text" id="test" name="test" placeholder="test" value="">
        <input class="hb_button3" type="submit" id="modalbutton" value="save"> <!-- once submit value taken on the checkbox will be save to the system database -->
    </a>
</form>

<form method="post" name="modalForm" id="modalForm" action="testing.php">
    <div class="modalwrapper" id="modal">   <!-- modal -->
            <div class="modalcontainer">    
                <div class="modalcol1">
                    <label>Basketball </label>
                    <input type="checkbox" id="test_modal[]" name="test_modal[]" value="1">
                    <div class="clear"></div>
                    <label>Baseball </label>
                    <input type="checkbox" id="test_modal[]"  name="test_modal[]" value="2">
                    <div class="clear"></div>
                    <label>Soccer </label>
                    <input type="checkbox" id="test_modal[]" name="test_modal[]" value="3">
                    <div class="clear"></div>
                    <label>Volleyball </label>
                    <input type="checkbox" id="test_modal[]" name="test_modal[]" value="4">
                    <div class="clear"></div>
                    <label>DOTA :)</label>
                    <input type="checkbox" id="test_modal[]" name="test_modal[]" value="5">
                    <div class="clear"></div>

                    <div class="savebutton">
                        <input class="btn1" id="submit" type="submit" value="Submit"/>
                    </div>
                </div>
            </div>
        <div class="overlay"></div>
    </div>      
</form>

这是我的 styles.css

/* modal layout */
    .modalwrapper {
        top: 0;
        left: 0;
        opacity: 0;
        position: absolute;
        visibility: hidden;
        box-shadow: 0 3px 7px rgba(0,0,0,.25);
        box-sizing: border-box;
        transition: all .4s ease-in-out;
        -webkit-transition: all .4s ease-in-out;
        -moz-transition: all .4s ease-in-out;
    }

    .modalwrapper:target {
        opacity: 1;
        visibility: visible
    }

    .overlay {
        background-color: #000;
        background: rgba(0,0,0,.8);
        height: 100%;
        left: 0;
        position: fixed;
        top: 0;
        width: 100%;
        z-index: 1;
    }

    .modalcontainer {
        display: table;
        background-color: #777;
        position: relative;
        z-index: 100;
        color: #fff;
        padding: 5px;
    }

    .modalcol1 { display: table-cell; }

    .clear { clear: both; }

    .modalwrapper input[type=checkbox] {
        float: right;
        margin-right: 20px;
    }

    .savebutton input[type=submit] {
        float: right;
        background-color: maroon;
        color: #fff;
        border: none;
        padding: 5px 10px;
        margin-top: 5px;
        margin-right: 20px;
    }
    /* modal layout ends here */

我的 javascript 代码

$(document).ready(function(){
        $("#done").click(function(e) {
                    // alert('ok');
                 $("#modal").fadeIn();
                // e.preventDefault();
                 });
            $("#submit").click(function(e) {

                var checked = [];
                i=0;
                temp=""
        $("input[name='test_modal[]']:checked").each(function ()
        {   temp=$(this).val();
            i++;
           checked.push($(this).val());
        });
        if (i==1)
              $("#test").val(temp);        
          else if (i>1)
              $("#test").val('multiple');
              else if (i==0)
              $("#test").val('nothing');
                         $("#modal").fadeOut();  
                        // alert($("#do").val())
            e.preventDefault();
        });
    });

希望你能帮助我们。如果你们可以建议用if条件之类的任何php语句替换我的javascript，我会尝试测试它。非常感谢。

存储 - 保存 - 获取/检索数组值（php）

0 个答案: