$xhr form submission.

1,095 views
Skip to first unread message

pVelicherla

unread,
Jan 10, 2012, 8:53:09 AM1/10/12
to ang...@googlegroups.com
Hi Team,

I tried to use the $xhr service in angular js . I am wondering  is there any way I can specify the form Object to $xhr object where in it will take care of sending all the form data.

Vojta Jina

unread,
Jan 11, 2012, 2:17:39 AM1/11/12
to ang...@googlegroups.com
You can send any object through $xhr service, so yep, you can send object from form.

Did you try something like this:

<form name="myForm" ng:controller="Ctrl" ng:submit="send(user)">
  <input ng:model="user.first" />
  <input ng:model="user.last" />
</form>

function Ctrl() {
  this.send = function(user) {
    $xhr('get', '/some/url.py', user, function() {});
  };
}

V.

Pratheep Velicherla

unread,
Jan 11, 2012, 8:34:19 AM1/11/12
to ang...@googlegroups.com
Hi,

Say my user Object is having unnecessary data like type,validation,error messages etc. in that case I can't simply send whole my json data back to server . Without using jQuery serialize is there any way I can tell the $xhr to take my whole form data.?

example :

user = {
    first : {name : 'FirstName',value='default value',required:true,number:false,phone:false,zip:false},
    last : {name : 'LastName',value='default value',required:false,number:false,phone:false,zip:false},
    phone : {name : 'Phone',value='default value',required:false,number:false,phone:true,zip:false},
}

}

V.

--
You received this message because you are subscribed to the Google Groups "AngularJS" group.
To view this discussion on the web visit https://groups.google.com/d/msg/angular/-/uyKCM1oWknAJ.

To post to this group, send email to ang...@googlegroups.com.
To unsubscribe from this group, send email to angular+u...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/angular?hl=en.



--
--Pratheepv

Witold Szczerba

unread,
Jan 11, 2012, 11:48:57 AM1/11/12
to ang...@googlegroups.com

What kind of data is that? Where do you get such a structure from?
Can you split it, so user data is in one object and that other meta-something is in another?

Regards,
Witold Szczerba

Pratheep Velicherla

unread,
Jan 12, 2012, 12:43:17 AM1/12/12
to ang...@googlegroups.com
Hi,

It is my application data.It is more of dynamic form .If need to split it means I need to do a lot in back-end. With touching my existing back-end is there any way I can tell the $xhr that take my whole form and send to particular url.

--Pratheepv

2012/1/11 Witold Szczerba <pljos...@gmail.com>



--
--Pratheepv

Witold Szczerba

unread,
Jan 12, 2012, 3:17:42 AM1/12/12
to ang...@googlegroups.com
So maybe extract user data just before sending them to the server. No
need for back-end modifications.

--
Witold Szczerba

2012/1/12 Pratheep Velicherla <pratheep....@gmail.com>:

Pratheep Velicherla

unread,
Jan 13, 2012, 12:39:39 AM1/13/12
to ang...@googlegroups.com
Hi,

When i am posting the data to server using $xhr service it is not posting the data but If do same thing using jQuery Ajax it is sending the data. Correct If I am doing the any thing wrong.

var data = form.serialize();
$.ajax({type: 'POST',
           dataType: "json",
           data: data,
            url: '../../test?j=123' ,
            success: function(data){
            if(data.status) {
            alert('Sucess');
            }
            else{
            alert('Failure');
            }
            },
            error: function(response) {
             alert('There was an error processing the request. Please refresh the page and try again.');
            }
   });


/*$xhr.defaults.headers['post']['Content-Type'] = 'application/json';
$xhr('POST', '../../test?j=123' , data, function( code, response) {

});*/

--Pratheepv

2012/1/12 Witold Szczerba <pljos...@gmail.com>



--
--Pratheepv

mich...@gmail.com

unread,
Aug 19, 2012, 6:38:14 PM8/19/12
to ang...@googlegroups.com
Hello, 

Same question for me:
Is there a way to send the equivalent of jquery form.serialize, ie the whole form to the server in a simple way?

Thks

Will Kriski

unread,
Aug 20, 2012, 11:02:04 AM8/20/12
to ang...@googlegroups.com, mich...@gmail.com
I figured out how to use jquery form.serialize. Pass the $event to the ng-click function in the form and then grab the DOM element with:
var elem angular.element(e.srcElement);
        alert($(elem.parent()).serialize());


Let me know how it goes.
Will

ProLoser

unread,
Aug 20, 2012, 4:44:45 PM8/20/12
to ang...@googlegroups.com
If you are serializing the form then you are doing it wrong.

mich...@gmail.com

unread,
Aug 20, 2012, 4:45:25 PM8/20/12
to ang...@googlegroups.com, mich...@gmail.com
It seems like it doesn't work...

Will Kriski

unread,
Aug 20, 2012, 5:16:00 PM8/20/12
to ang...@googlegroups.com, mich...@gmail.com
My fiddle works to get the parameters from the form and uses the serialize function that I thought you wanted. Whoever knows the answer please post your solution for the questioner. 

W

mich...@gmail.com

unread,
Aug 20, 2012, 5:38:26 PM8/20/12
to ang...@googlegroups.com, mich...@gmail.com
I tried something  like that:

http://jsfiddle.net/michelpa/TfQMe/

Tell me what do you think?

But it use jquery... what about without...

mich...@gmail.com

unread,
Aug 20, 2012, 5:41:34 PM8/20/12
to ang...@googlegroups.com, mich...@gmail.com

michael versak

unread,
Jun 19, 2014, 9:36:07 AM6/19/14
to ang...@googlegroups.com
Instead of posting a comment on how they're "doing it wrong" how about a little insight on how to do it right?
Reply all
Reply to author
Forward
0 new messages