写url以形成输入值

时间:2011-06-01 18:35:15

标签: jquery forms dialog

问题:我不知道为什么我的脚本没有将值加载到表单的选定输入节中

情境: 该页面将其称为主页,永久显示一个带有链接作为内容的对话框。如果用户单击链接另一个对话框,则调用它,打开一个带有表单的“表单对话框”。一些项目通过主机页面的代码 - 平台,浏览器和URL插入到表单中。

这是无效的网址。

在主页上获取URL并将其存储为.data项,以便通过“表单对话框”脚本进行恢复。 我在一个更简单的设置上对此进行了测试,并且它工作得很好但是,它拒绝在当前设置上工作。

症状: URL按预期读取和存储,但脚本不会将其写入表单。我使用的方法是在首次加载对话框时添加回调函数。回调使用.val()函数将数据写入表单,或者至少是意图。 在对话框设置期间将值写入表单,以便在用户单击时已将信息加载到表单中。

我很感激任何关于问题可能原因和/或纠正方法的指示或建议。

感谢。

脚本:

enter <script type="text/javascript">
//Triggers a modal containing the feedback form.
$(document).ready(function() {
$('#target a').each(function() {
    var $link = $(this);
    var $dialog = $('<div></div>')
        .load($link.attr('href'))
        .dialog({
            autoOpen: false,
            title: $link.attr('title'),
            width: 600,
            height: 500,
            modal:  true,
            open:   function (event,ui) {
                $("input[name='url']").val($('body').data('value2'));


            }
        });

    $link.click(function() {
        $dialog.dialog('open');
        $( "#accordion" ).accordion({
            collapsible: true,
            active: false
        });
        return false;
    });
});
});
</script>

HOST PAGE

<html xmlns="http://www.w3.org/1999/xhtml">

</head>

<body>


<!--Script to get the url of the page and store it as a data item for use on the form -->
<script type="text/javascript">
<?php 
     $url = "http://".$_SERVER['HTTP_HOST'].$_SERVER['REQUEST_URI'];
     ?>
var pageAddress="<?php echo $url?>";

$('body').data('value2', pageAddress );

</script>
<p>The following just confirms that the  url is being stored on the page</p>
<div>
The URL value stored on the page is 
<span id='urlcheck'></span>
<p>The location is 
</p>

<script type="text/javascript">
$("span#urlcheck").html("<p>" +$("body").data("value2")+ "</p>");
</script>
</div>



<!--Check to see if the cookie is set -->
<?php include ('../_assets/include_files/checkreaderStatus.php');?>
<!-- The following file is for development only. It adds a navigation menu to pages in   which its included. -->
<?php  include('../_assets/include_files/navigation.html');?>
<!--------------------------------------------------------------------------->
<!-- Start The Page Display -->
<h1>Page 1 Of The Blog</h1>
<p>This page simulates the page on the blog where testers will land.</p>

<!--Dialog for the "Feedback Form Button -->
<script type="text/javascript">
//Reads the flag readerStatus, if set creates a dialog with a permanently displayed "Feedback Button". NOTE TO SELF: This has to be on the page in order for the php to be to be processed by the server!
var readerStatus="<?php echo $readerStatus; ?>";
if (readerStatus == "tester") {
    $(function(){
        $("#dialog").dialog();
                })
}
</script>

<!-- Content for the Feedback Form Button -->   
<div id="dialog" title="Feedback Button">
<div  title="Feedback Form">
    <p id='target'><a href="feedbackform.php"  title='Feedback Form' >Feedback   Form</a></p>
    <p class="notes">This form is dragable and resizable</p>
</div>
</div>




<script type="text/javascript">
//Triggers a modal containing the feedback form.
$(document).ready(function() {
$('#target a').each(function() {
    var $link = $(this);
    var $dialog = $('<div></div>')
        .load($link.attr('href'))
        .dialog({
            autoOpen: false,
            title: $link.attr('title'),
            width: 600,
            height: 500,
            modal:  true,
            open:   function (event,ui) {
                $("input[name='url']").val($('body').data('value2'));


            }
        });

    $link.click(function() {
        $dialog.dialog('open');
        $( "#accordion" ).accordion({
            collapsible: true,
            active: false
        });
        return false;
    });
});
});
</script>
</body>
</html>

反馈表                         反馈表                    

<link rel="stylesheet" type="text/css" href="../_assets/scripts/black-tie/jquery-ui-1.8.4.custom.css" />
</head>

<body>



<?php
$browser = get_browser(null, true);
?>
<!-- ajax form next? -->
<script type="text/javascript">
$(document).ready(function() {
var options = {
    target : '#output1',
    url:    'comments.php',
    clearForm:  'true'
};
// bind 'myForm' and provide a simple callback function 
$('#myform').ajaxForm(options);
return false;
});
</script>
<!-- Script to execute text prompts in the fields -->
<!-- optional name -->
<script type="text/javascript" id="demoscript">
$(document).ready(function(){
  //Optionsal Name
    $("#textTagDemo").fieldtag();
  //Textarea
    $("#area").fieldtag();
});
</script>







<div id="accordion">
<h3><a href="#">Instructions</a></h3>
    <div>
        <p>
        Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer
        ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit
        amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut
        odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate.
        </p>
    </div>
<h3><a href="#">Broken Links</a></h3>
<div>
<form action="comments.php" method="post" name="broken_Links" id="myform" >
                <fieldset>
                    <p>
                        <input name="name" type="text" size="50" id="textTagDemo" title="OPTIONAL: Add your name" />

                    </p>
                    <p>
                        <input name="nowhere" type="radio" value="linknowhere" />Link is
                        broken and doesn't go anywhere
                    </p>
                    <p>
                        <input name="wrong_url" type="radio" value="linktowrongurl" />Link
                        goes to an unexpected destination
                    </p>
                    <p>
                        <input name="other" type="radio" value="linkother" />Other -
                        Please explain in the description box below
                    </p>
                    <em>Description</em>
                    <p>Please add as much descripton as you can about the problem you
                        noticed</p>
                    <textarea name="description" id="area" cols="50" rows="10" title="Please add as much description as you can."></textarea>
                    <p>
                        Page Address: <br /> <input name="url" type="text" value=""
                            id="targetURL" size="100" title="Page Address" />
                    </p>
                    <p>
                        Browser<input name="browser" type="text"
                            value="<?php echo $browser['browser'] ?>" />
                    </p>
                    <p>
                        Operating System<input name="operating_system" type="text"
                            value="<?php echo $browser['platform'] ?>" />
                    </p>
                    <p>
                        <input type="submit" name="submit" id="button" value="Submit" />
                    </p>
                </fieldset>
            </form>
    <!-- server response -->
            <h2>Output Response</h2>
            <p id="output1">

            </p>
            <!--End form 4 broken links-->
</div>
<h3><a href="#">Errors In The Text</a></h3>
<div>
    <p>
    Nam enim risus, molestie et, porta ac, aliquam ac, risus. Quisque lobortis.
    Phasellus pellentesque purus in massa. Aenean in pede. Phasellus ac libero
    ac tellus pellentesque semper. Sed ac felis. Sed commodo, magna quis
    lacinia ornare, quam ante aliquam nisi, eu iaculis leo purus venenatis dui.
    </p>
    <ul>
        <li>List item one</li>
        <li>List item two</li>
        <li>List item three</li>
    </ul>
</div>
<h3><a href="#">Confusing Layout</a></h3>
<div>
    <p>
    Cras dictum. Pellentesque habitant morbi tristique senectus et netus
    et malesuada fames ac turpis egestas. Vestibulum ante ipsum primis in
    faucibus orci luctus et ultrices posuere cubilia Curae; Aenean lacinia
    mauris vel est.
    </p>
    <p>
    Suspendisse eu nisl. Nullam ut libero. Integer dignissim consequat lectus.
    Class aptent taciti sociosqu ad litora torquent per conubia nostra, per
    inceptos himenaeos.
    </p>
</div>
</div>
</body>
</html>

1 个答案:

答案 0 :(得分:1)

我想问的是,如果没有将数据包装在$(document).ready()子句中,就会将数据放到主体上。

要快速修复,您可以将url定义为变量,然后在脚本中访问该变量。

示例:

http://jsfiddle.net/LF2rs/1/

PS: 我建议阅读分离你的PHP代码(使用模板),你的javascript(将它们单独放在.js文件中!)。这将使发现和防止错误变得更容易和易于管理。