在jQuery脚本中更新变量

时间:2014-01-28 15:51:32

标签: php jquery ajax

我目前正在构建一个动态表单,使用一些HTML,PHP和jQuery。此表单包含一个下拉选择字段(带有标记名称)和两个名为tag_text_color和tag_background_color的输入框。

当你在select字段中选择一个标签时,一些jQuery会用当前数据库值填充tag_text_color和tag_background_color框。

在此之前,我有一个允许用户在数据库中添加标签的表单。我在数据库中添加标记之前就出现了问题。

以下是添加标记的代码:

        <form id="form_addtag" method="post" name="form_addtag" action="add_tag.php">
                <legend>Add a tag</legend>
                <input type="text" name="tag_name" id="tag_name" class="text" size="30" placeholder="Tag Name" />
                <input type="text" name="tag_text_color" id="tag_text_color" class="text" size="6" placeholder="#ffffff"/>
                <input type="text" name="tag_bg_color" id="tag_bg_color" class="text" size="6" placeholder="#000000" />
                <button type="submit" id="button_save_tag">Add</button>
        </form>

和jQuery对应的函数:

    $( document ).ready(function() { 
        $("#form_addtag").submit(function(e) {
        e.preventDefault();
        var url = "add_tag.php"; // the script where you handle the form input.
        $.ajax({
            type: "POST",
            url: url,
            data: $("#form_addtag").serialize(), // serializes the form's elements.
        });
        $('#form_addtag')[0].reset();
        $("#form_edittag").load("demo.php #form_edittag")
    });

添加标签工作正常,它可以完美地重新加载表单以编辑标签。但是,如果在此块中我选择了新标记,则jQuery

尚未加载它

用于编辑代码的HTML:

        <form id="form_edittag" method="post" name="form_edittag" action="edit_tag.php">
            <legend>Edit a tag</legend>
            <select id="select_edittag">

                <?php
                $tags = get_tags();
                $numberOfTags = sizeof($tags);
                var_dump($numberOfTags);
                var_dump($tags);
                foreach ($tags as $line)
                {
                    echo("<option value='".$line["name"]."''>".$line["name"]."</option>");
                }
                    //print("<option value='". $tags[ $j ]["name"]."'>".$tags[ $j ]["name"]."</option>");
            ?>
            </select>
            <input type="text" name="tag_text_color_edit" id="tag_text_color_edit" class="text" size="6" />
            <input type="text" name="tag_bg_color_edit" id="tag_bg_color_edit" class="text" size="6" />
            <button type="submit" id="button_edit_tag">Edit</button>
            <button type="submit" id="button_delete_tag">Delete</button>
        </form>

对应的jQuery:

    $( document ).ready(function() {
        $( document ).on( "change", "select#select_edittag", function()
        {
            var name = $("#select_edittag").val();
            var tags = <?php echo json_encode(get_tags()); ?>;
            $("#tag_text_color_edit").val(tags[name]["text_color"]);
            $("#tag_bg_color_edit").val(tags[name]["background_color"]);
        });
    });

函数get_tags()将返回一个包含数据库中所有标记的数组。

我想每次在我的select&#34; select_edittag&#34;中选择一个新项目时它将运行脚本,并使用函数get_tags()中的最新内容更新tags变量。它并不遗憾。

有什么想法吗?如果你想要一个现场演示,我可以举办类似的东西

1 个答案:

答案 0 :(得分:0)

没有

加载页面时,PHP运行一次。你必须通过ajax重新填充'标签'。检查:getJSON