Sending form values to web service

This is a brand new this morning to me, and i thin i understand what I need to do but could do with a bit of support.

I have a form

<form action="#" method="post" id="myform">
<div class="field">
<label for="form1_name">First Name *</label>
<input id="form1_name" type="text" name="fname" value="<?php if ($_POST['fname'] && empty($success)) { echo $_POST['fname']; } ?>"/>
</form>

There loads more input fields, but using it as an example.

Then I think I need to do somehting like this, but unsure how to collect the form input values for starters and then how to send them to the web service.

So have made a start with below

<script>
var frm = $('#myform');
var formData = JSON.stringify(frm.serializeArray());

$.ajax({
url: 'http://dev.mysite.com/WebService.asmx', 
type: "POST",
contentType: "application/json",
data: formData,
dataType: "json",
success: function (result) {
alert("Hello! I am an alert box!!");
}
});
</script>

Am I on the right path for starters, and could I have a helping hand please to take it forward

Isn’t .asmx part of ASP.NET? I don’t think you can mix those two languages together. IIS uses the same port as Apache and Ngnix so I don’t think it’s possible to even combine PHP with ASP.NET.

Hi, I dont think its mixxing, it, as what Im trying to do is collect the form input values and use jquery to send the values to it, so there no php in it really

There was (before you edited your post).

What I meant was you are using PHP to submit your register.php file, but then you use .asmx to retrieve a Json data. Why not use PHP for both? Using 2 languages at the same time will confuse you because if you only know one, there’s really no point trying to put the other language in if you have no knowledge of it. So I suggest just using the one you know more.

Ye I get you, I think ideally I would rather the jquery collects the form values and posts them, as that was what I was trying to do from the start but I sort of mixed a few bits up.

I admit to changing the action last minute, it was my mistake as i was cutting and pasting code

Then I suggest updating the file where you copy&paste from. Using 2 server-side languages may collide with one another causing your website to crash. It is also important to make sure that your live server also supports the language you want to use.

I understand guys, it wasnt a copy and paste from the same place, but my bad, I probably posted on here to soon.

I have made a few changes which I think is correct

<script>
$('#myForm').submit(function() {
var frm = $('#myform :input');

var values = {};
$frm.each(function() {
values[this.name] = $(this).val();
});

$.ajax({
url: 'http://dev.mysite.com/WebService.asmx/CheckConnection', 
type: "POST",
contentType: "application/json",
data: values,
dataType: "json",
success: function (result) {
alert("Hello! I am an alert box!!");
}
});
});
</script>

I dont get an echo with success on the above, although it seems to look right. So will I get a sucess if it posts successfully and returns, or is it just that the code completes to that point without any errors.

Im also wondering as I cant get a success anyway to prove Im right or wrong if its better to go back to

var values = JSON.stringify(frm.serializeArray());

instead of

var values = {};
$frm.each(function() {
values[this.name] = $(this).val();
});

I added an error function below the success function, and briefly the error function appears but no status as below

success: function (result) {
alert("Hello! I am an alert box!!");
},
error: function (xhr, status) {
alert("An error occurred: " + status);
}

I have tried some new code, and all I get is the error alert every time, so I am asking our server guys to check that side out, but what I want to know is is the error alert coming from bad code, or is it because im not connecting to the web service.

$('#myForm').submit(function() {
var fname = $("input[name=\"fname\"]").val();
var sname = $("input[name=\"sname\"]").val();

$.ajax({
url: "http://dev.mysite.com/WebService.asmx/CheckConnection",
type: "POST",
async: false,
cache: false,
dataType: "json",
data: "{ 'id': '" + fname + "', 'surname': '" + sname + "' }",
 //data: "{ 'id': '(" + fname + ")'.val()}",
contentType: "application/json; charset=utf-8",
success: function(data) {
alert("Hello! I am an alert box!!");
},
error: function(xhr, ajaxOptions, thrownError) {
alert("Nope");
}
});

And tried this too

data: "{ 'id': '(" + fname + ")'.val()",

I added this to error

alert(thrownError);

And this is the error i got which I’m going to look into but it looks complicated

Exception… “Failure” nsresult: “0x80004005 (NS_ERROR_FAILURE)” location: “JS frame :: http://code.jquery.com/jquery-latest.min.js :: .send :: line 4” data: no]

I changed it again to the code below, and im now not getting the error so it seems to be sending but we are not recieving anything at the web service

$.ajax({
type: "GET",
url: 'https://www.mysite.com/WebService.asmx/TestMethodVoid',
data: "{'id':'" + '6' + "'}",
contentType: "application/json; charset=utf-8",
dataType: "jsonp",
success: function (msg)
{
$("#divResult").html(msg.d);
},
error: function (e)
{
$("#divResult").html("e:" + e + " | e.error: " + e.error + " | e.responseText: " + e.responseText + " | e.status: " + e.status + " | e.statusText: " + e.statusText + " | e.isRejected: " + e.isRejected);
}
});

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.