ajax请求需要协助

时间:2013-05-27 11:13:22

标签: javascript jquery ajax playframework playframework-1.x

您好我正在使用Play框架1.2.3和eclipse,我想用这个java请求调用一个控制器方法,但是当我点击按钮时没有任何反应。有谁知道出了什么问题?

最诚挚的问候。

<script type="text/javascript">   
    $("#request").click(function(){  

            var reqphone = $('#reqPhone').val();  
            var key = $('#accesscode).val();    
            var fro = $('#from').val();  
            var too = $('#to').val();  
            var myPhone = $('#userPhone').val();  

            var action = #{jsAction @reversetest(':consumer',':accessKey', ':usersPhone', ':reqPhone',':from', ':to') /};  

            $.ajax({  
                type:"GET",  
                url =  action({consumer: 'marcus', accessKey: key, usersPhone: myPhone, reqPhone: reqphone, from: fro, to: too}),  
                success: function (response)  
                {
                    $("#XMLArea").val(response);  
                }
            });

    })
    </script>  

    <input type="button" id="request" class="button" name="request" style="float: left; top: 50px; left: 310px; position: absolute;"></input>  

我会添加一些更多的信息,因为我已经改变了你提到的东西,但它仍然无法正常工作这里是逆向控制器方法

public static void reversetest(@Required String consumer, @Required String accessKey, @Required String usersPhone,
                @Required String reqPhone, @Required Integer from, @Required Integer to)
    {
        // Start time
            long _started = System.currentTimeMillis();

            // Send the query
            ResultObject result = models.functions.Reverse.v1(consumer, Telephones.ResponseTypes.CALLERID, accessKey, reqPhone,
                    usersPhone, from, to, (String) request.remoteAddress);
            // Statistics
            QueryCount++;
            if (result.Code != ResultCodes.OK)
                ErrorCount++;
            Long elapsed = (System.currentTimeMillis() - _started);
            QueryTime += elapsed;
            if (elapsed > MaxTime)
                MaxTime = elapsed;

            // Render
            if(result.Code == ResultCodes.NOTAUTHORIZED)
                render(result.Code);
            else if(result.Code == ResultCodes.TRANSFORMERROR)
                render(result.Code);
            else if(result.Code == ResultCodes.BADREQUEST)
                render(result.Code);
            else if(result.Code == ResultCodes.JAVAEXCEPTION)
                render(result.Code);
            else if(result.Code == ResultCodes.NOTHREADS)
                render(result.Code);


            renderXml(result.getXMLResponse());
    }

这是完整的HTML代码

<head>
    <title></title>
    <style type="text/css">
        .button {
            -moz-box-shadow: inset 0px 1px 0px 0px #ffffff;
            -webkit-box-shadow: inset 0px 1px 0px 0px #ffffff;
            box-shadow: inset 0px 1px 0px 0px #ffffff;
            background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ededed), color-stop(1, #dfdfdf) );
            background: -moz-linear-gradient( center top, #ededed 5%, #dfdfdf 100% );
            filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#dfdfdf');
            background-color: #ededed;
            -moz-border-radius: 6px;
            -webkit-border-radius: 6px;
            border-radius: 6px;
            border: 1px solid #dcdcdc;
            display: inline-block;
            color: #777777;
            font-family: arial;
            font-size: 15px;
            font-weight: bold;
            padding: 6px 24px;
            text-decoration: none;
            text-shadow: 1px 1px 0px #ffffff;
        }

            .button:hover {
                background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #dfdfdf), color-stop(1, #ededed) );
                background: -moz-linear-gradient( center top, #dfdfdf 5%, #ededed 100% );
                filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#dfdfdf', endColorstr='#ededed');
                background-color: #dfdfdf;
            }

            .button:active {
                position: relative;
                top: 1px;
            }

        .text {
            border: 2px solid gray;
        }

        .textarea {
            width: 900px;
            height: 300px;
            border: 3px solid gray;
            padding: 5px;
            font-family: Tahoma, sans-serif;
            background-image: url(bg.gif);
            background-position: bottom right;
            background-repeat: no-repeat;
        }

        .label {
            color: #B4886B;
            font-weight: bold;
            display: block;
            width: 150px;
            float: left;
        }

            label:after {
                content: ": ";
            }
    </style>

    <script type="text/javascript">
    $("#request").click(function(){

        var reqphone = $('#reqPhone').val();
        var key = $('#accesscode').val();
        var fro = $('#from').val();
        var too = $('#to').val();
        var myPhone = $('#userPhone').val();
        var action = #{jsAction @reversetest(':consumer',':accessKey', ':usersPhone', ':reqPhone',':from', ':to') /};

    $.ajax({
        type:"GET",
        url:@{Testbench.reversetest},
        data: = action{consumer: 'marcus', accessKey: key, usersPhone: myPhone, reqPhone: reqphone, from: fro, to: too},
        success: function (response)
        {
            $("#XMLArea").val(response);
        }
    });

})
    </script>
    <script type="text/javascript">
        function setbg(color) {
            document.getElementById("styled").style.background = color
        }


        //@Required String consumer, @Required String accesscode, @Required String usersPhone,
        //@Required String reqPhone, @Required Integer from, @Required Integer to


    </script>
</head>
<body style="background-color:#C3C3C3">
    <div style="float:left; position:absolute; left: 200px;">
        <header id="header1" style="width: 915px; height: 100px; border-bottom: 1px inset gray; background-image:url(pictures/mobisafeheader.jpg);" ></header>
        <br>
        <div id="sendDiv" style="float:left; top:120px; position:absolute;">
            <datalist id="numbers">
                <option>07086000000</option>
                <option>07074000000</option>
            </datalist>
            <datalist id="accesscodes">
                <option>marcus</option>
                <option>jesper</option>
            </datalist>

               <label class="label" id="phone">Your phone</label> 
               <input type="text" id="userPhone" class="text" list="numbers" style="float:left; left:150px; position:absolute;"></input>
                <br></br>
                <label class="label" id="accesscodeLbl" style="top:35px; float:left; position:absolute;">Your accesscode</label><input type="text" id="accesscode" class="text" list="accesscodes" style="float:left; left:150px; top:30px; position:absolute;"></input>
                <br></br>
                <label class="label" id="reqPhoneLbl" style="top:70px; float:left; position:absolute;">Calling Phone</label><input type="text" id="reqPhone" class="text" style="float:left; left: 150px; top: 60px; position: absolute;"></input>
                <input type="hidden" value="1" class="text" name="from"></input>
                <br></br>
                <input type="hidden" value="1" class="text" name="to"></input> 
                <input type="button" id="request" name="request" style="float: left; top: 50px; left: 310px; position: absolute;"></input>

        </div>
        <div id="textAreaDiv" style="position:absolute; float:left; top:250px;" draggable="false">
            <br></br>
            <br></br>
            <label class="label">URL</label>
            <input id="URL" type="text" class="text" style="width:745px;"></input>
            <br></br>
            <textarea id="XMLArea" class="textarea" draggable="false" onfocus="this.value=''; setbg('#e5fff3');" onblur="setbg('white')"></textarea>
        </div>
    </div>


</body>

希望这有助于您识别我的错误。

最诚挚的问候。

3 个答案:

答案 0 :(得分:0)

你错过了'at var key = $('#accesscode')。val();

var key = $('#accesscode).val();

应该是

var key = $('#accesscode').val();

和另一件事

$.ajax({  
    type:"GET",  
    url =  action({consumer: 'marcus', accessKey: key, usersPhone: myPhone, reqPhone: reqphone, from: fro, to: too}),  
    success: function (response)  
    {
        $("#XMLArea").val(response);  
    }
});

应该是

$.ajax({  
    type:"GET",  
    url : 'your url', 
    data: {consumer: 'marcus', accessKey: key, usersPhone: myPhone, reqPhone: reqphone, from: fro, to: too},  
    success: function (response)  
    {
        $("#XMLArea").val(response);  
    }
});

答案 1 :(得分:0)

Url =应为data

$.ajax({  
    type:"GET",  
    url: 'url.url',
    data : action({consumer: 'marcus', accessKey: key, usersPhone: myPhone, reqPhone: reqphone, from: fro, to: too}),  
    success: function (response)  
    {
        $("#XMLArea").val(response);  
    }
});

答案 2 :(得分:0)

缺少Url部分。

$.ajax({  
    type:"GET",  
    url: 'your url',
    data : action({consumer: 'marcus', accessKey: key, usersPhone: myPhone, reqPhone: reqphone, from: fro, to: too}),  
    success: function (response)  
    {
             // catch data coming back from server
    }
});

使用数据部分将数据发送到服务器。