0

I have two web pages A.html and B.html(Thrid party provided so i dont have access for its code). Where A.html has form and onClick of submit the data is sent to B.html with method="post" and target="chat".

As soon as B.html receives A.html request a pop up for Chat window starts. But now i dont want the user to fill form every time and submit to start support of chat and i want to accomplish this using javascript/jquery only without asking user to fill in the HTML form.

Below is my form code in html:

<label for="sample" style="display: none;">sample</label>
<form name="sample" id="sample" method="post" target="chat" >

    <div class="form_elem">
        Name : <input type="text" id="vName" name="vName" value=""> <div class="error">*</div>

        Mobile Number : <input type="text" id="mobile"  name="21512" value=""> <div class="error">*</div>

        Connection Type : <select name="21524" id="state">
            <option value="0" selected="selected">Select</option>
            <option value="24">PF</option>
            <option value="25">PD</option>
        </select> <label> &nbsp;</label>

        <input type="button" style="border-width: 0px; margin-right: 10px; cursor: pointer;" onclick="javascript:return Submit_Data();" value="Submit"  name="btnSubmit" class="submit">
        <input type="button" style="border-width: 0px; margin-right: 10px; cursor: pointer;" onclick="javascript:return Clear_Click(&#39;old&#39;)" value="Clear" name="btnclear" class="reset">

    </div>

</form>

function Submit_Data()
{
    window.open("Live Chat", "chat", "height=" + ChatWindow_Height + ", width = " + ChatWindow_Width);

    var url = "B.Html";

    var form = document.getElementById("sample");
    form.action = url;
    form.submit();  
}

Assuming data necessary to be sent is hard coded now like. var name='pawan',mobile='9930667xxx',state='24'. How to write javascript/jQuery that doesnot involve any html form and submits data directly to B.html ? Thanks.

1 Answers1

0

try this

$.ajax({
            async:true,
            type: "POST",
            dataType: "json",
            contentType: "application/x-www-form-urlencoded",
            url: "pageB",
            data:"para="+variable,
            beforeSend: function,
            success:function,
            timeout:10000,
            error:function
        });

para=variable para is the post in the server $_POST['para']

http://api.jquery.com/jquery.ajax/

Tlaloc-ES
  • 4,825
  • 7
  • 38
  • 84
  • I will get back to you soon after trying it. –  May 27 '14 at 10:53
  • I modified your code a bit as like: $.ajax({ type: "POST", url: "xyz.com/VisitorChat/B.html", data:"vName=pawan&mobile=9930667xxx&state=24", success:function(res){ alert("passed "+res); } }); But in on console i got XMLHttpRequest cannot load xyz.com/VisitorChat/B.html. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://xxx.21.11.xxx:10080' is therefore not allowed access. index.html:1 –  May 27 '14 at 11:06
  • http://stackoverflow.com/questions/3828982/xmlhttprequest-cannot-load-an-url-with-jquery http://www.coderslexicon.com/tricks-for-getting-around-the-xmlhttprequest-cannot-load-security-limitation-in-javascript/ – Tlaloc-ES May 27 '14 at 11:24
  • I don't have any control over that B.Html of different domain site. And yeas its a cross domain call. But one thing i am not getting why submitting via form i am able to work perfectly but not like this. –  May 27 '14 at 11:57