Django - show result (error) with javascript - javascript

I have form, that accepts number between 1-6 and a file. You can see code in my other question: https://stackoverflow.com/questions/43611769/django-javascript-modal-form-validation
I have to validate form, without having to reload it as it is modal form and it closes on refresh (or is should open it on refresh, but i don't really like the idea of reloading). So i want the modal to show error, if there is any (wrong file type, model already exists...) How would i achieve this?
Somebody suggested me to post form asynchronously and show error with javascript. How would i send javascript message from views in django, without the page having to reload? Could it be done with Json? How?
Thank you in advance!

You have to options:
Django validation view which will return JsonResponse
In that case you send your data to this view which will check if data are valid and return appropriate response. Then you parse response and show error if any.
Javascript validation. You make validator in your javascript code which will check if filetype is suitable etc. Here you have example how to allow only specified types of files.
In both cases you should validate your data in view in which you are saving to Database/server while someone could send data directly to your saving view(e.g. with Postman).
I would suggest second approach because it is faster and one less call to server.

Related

Is there any better way to do like history.back() in django backend?

In Django, I have "form view(GET)" and "action view(POST)"
If there is a validation error or any other error in action view,
I want browser to go back to the previous form page with the input data whote by the user remains.
I tried:
At first, I used return redirect(request.META.get('HTTP_REFERER')).
This code goes back to the previous page well, but all the input fields became empty.
And now I am using return HttpResponse("<script>history.back();</script>") this code.
This works very well. but It looks weird sending javascript response.
What I expected was like return redirect.back()(with like HTTP 301 or 30X status code)
I was wondering if there is any better way or a proper way like officially provided by Django.

Form Validation - proper method for client and server side using PHP & Javascript

--edit--
(Trying to rephrase my question to be less confusing..)
My understanding is that you should validate forms both client and server side in case Javascript is not working.
How do advanced developers accomplish this in a seamless interface (if one had to describe in a general manner)?
Currently I have Javascript validating my input fields on the fly with 'onkeyup ()', highlighting invalid fields.
If I run the same validations with PHP after the user submits, then I have to redirect to the form if there were any errors, refreshing the page.
I thought this method was lacking sophistication.
What would be the best method?
Thanks in advance.
--- original question below ---
So I created a form with client side javascript to validate the input as the user types. It highlights the boxes w red borders if the data is invalid (using javascript to alter the css). I would like to re-validate the same data with php server side in case of any problems with javascript client side.
I am trying to figure out what is the proper (or best) way to accomplish this.
Currently the form action is setup to go to "register_post.php" after user hits submit.
--
So do I just validate the form data in PHP in "register_post.php", and redirect back to the form page if something is invalid, or is there a more sophisticated way to do this?
One annoying result of this is the page refreshing when the page is redirected.
Is there a more sophisticated way to do this?
--
Another related question is - should I prep my code for javascript not working at all? ..since currently, I use javascript to highlight the fields if the data is invalid. The user will have no indication of which fields are invalid without js.
please bear with me as I am a beginner.
You are trying to valid the post data with PHP and without refresh the page, I don't know if I get your point right. If you want to valid the data with PHP and without refreshing page, you could use AJAX. You can use javascript to post data to a PHP script and deal PHP return data.
An example of jquery ajax method :
<script>
var validDataArr = ''; //data need to be valided
$.ajax({
type:"post",url:"http://"+top.location.hostname+"/valid.php",
data:validDataArr,
success:function(context){alert(context);}
});
</script>
While submitting the form , call a javascript function to validate the fields and throw an error if it not suits.
you can call a js function as below
input type="submit" name="Submit" id="button2" value="Submit" onClick="javascript:verify()"/>
Try this , this will help you to understand the basic validation
http://jsfiddle.net/NWWL4/15/

ajax post big data Jquery

I am facing problem for sending big form data using ajax function to server i.e php page. In my page html input fields will add by users for making a quote. And user add many fields then all datas wont posted to server php page. Only some information will save in database and others will lost.
I have used post method in ajax function.
If you have any suggestion for this problem please suggest me.
Detect place of the problem
Check POST request. Did you see there your data. In case you see - there is only one reason some where on the server. It couldn't be limit of the post - because in this case you will never get any information on the server and all request would be cancelled.
Another place is in your javascript:
1. you make mistake in name of field
2. bug some where in library
3. bug in your code.
try to debug javascript and understand what happen there.

How to get POST contents before form submits using javascript

So, I know that when I submit a form whose method is POST that the server receives the contents of that form and then processes them accordingly, and then returns a page with the desired content. What I am trying to learn is what exact query url is being passed to the server side script when I submit a form on a website that does not belong to me. The reason I want this query string is so that I can make use of the server side script programatically with my own data. There is no public API served by this website, but I would like to formulate my own.
So my question is, is there a way to intercept the POST as a query string URL? Perhaps by using a javascript console in browser?
I know I can look at the source code for the page and find the names/values of the form fields. However, there also happens to be a hidden field on this page whose properties are set by javascript during validation at submission time. How should I go about this?
You can use an extension for intercept the data : Tamper Data on FireFox
https://addons.mozilla.org/fr/firefox/addon/tamper-data/
You can intercept and modify all headers requests

AJAX Form Submit v/s Standard Form Submit

I am trying to implement GSA(Google Search Appliance) in my app. I want to use the REST(JSON) call that the GSA provides. The point for this question is that, the GSA needs a POST request in order to return the JSON response.
Now when I made a new dummy HTML page with a form and make a POST request with parameters I get a successful response(JSON)
But, when I try using the $.post(...) method to send a POST request to the URL I am not getting the actual response, but some error page.
I just wanted to know is there a difference between a standard submit and an ajax form submit. If yes, is there any workaround for this situation.
Please Help. Thanks in Advance.
If you want to submit the form through ajax but in the conventional way, You should have a look at jquery form plugin . Just make your submit button to type button and on click submit your form thorugh .ajaxSubmit(). I think this will solve your problem.
GSA search protocol is based on HTTP GET. All search parameters need to be passed in via query string. Also, out of box, GSA only returns either HTML or XML results. You could apply an xslt that transforms xml to JSON -- but I'm yet to find one that works really well (i.e., I've found a couple but they don't return valid JSON in all instances).

Categories