2

forms.py

class SearchFilterForm(Form):
    fromdate = forms.CharField(widget=forms.TextInput(attrs={'placeholder': 'dd/mm/yy','class':'datefield','readonly':'readonly'}))
    todate = forms.CharField(widget=forms.TextInput(attrs={'placeholder': 'dd/mm/yy','class':'datefield','readonly':'readonly'}))

javascript:

function comparedate(){
        var fromdate = document.getElementById("id_fromdate").value;
        var todate = document.getElementById("id_todate").value;
        if(fromdate<todate){
        {
        $("#error-warning").show();
        $("#error-warning").text("Please correct the To date");          
        return false;        
    }

 }

template.html

<button type="submit" name="filter" onclick="comparedate()">Go <img src="/static/images/button-icon-ir-fwd.png" alt="" height="17" width="8"></button><div id="error-warning" style="display:none" class="errorlist">Please correct the To date</div>

This code is for validating the from date and to date.Validation is happening but after validation the form gets submit again.This is used in search report function,so if the entered to date is less than from date it is showing error message and it go's for search ,which should not happen.

Can any one tell me what would be the problem

Monk L
  • 3,358
  • 9
  • 26
  • 41
  • 1
    if you put onclick on submit the the submission may happen before or after validation happens (also depends if the page is navigating away or not) try using http://api.jquery.com/change/ on your date field and compare dates using http://stackoverflow.com/questions/5000693/comparing-dates-in-jquery this way you can compare dates as soon as the value changes and not wait for user to click on a button – boltsfrombluesky Jun 25 '13 at 15:02

3 Answers3

2

we have different solution for this problem, you can try it

<button type="submit" name="filter" onclick="javascript:return comparedate();"> Go<img src="/static/images/button-icon-ir-fwd.png" alt="" height="17" width="8"></button><div id="error-warning" style="display:none" class="errorlist">Please correct the To date</div>
Umer Farooq
  • 388
  • 3
  • 18
0
document.getElementById("button_id").disabled = true

$("id_todate").change(function(){ 
    var fromdate = document.getElementById("id_fromdate").value;
    var todate = document.getElementById("id_todate").value;

    if (Date.parse(fromdate) > Date.parse(todate)) { 
        $("#error-warning").hide();
        document.getElementById("button_id").disabled=false;   
    }else{
        $("#error-warning").show();
        $("#error-warning").text("Please correct the To date"); 
    }
}

<button type="submit" name="filter" id="button_id" disabled>Go <img src="/static/images/button-icon-ir-fwd.png" alt="" height="17" width="8"></button>
<div id="error-warning" style="display:none" class="errorlist">Please correct the To date</div>

Modified:

<html>
    <script type="text/javascript" src="jquery-1.10.1.min.js" ></script>
    <input type="date" id="id_fromdate" />
    <input type="date" id="id_todate" />
    <input type="submit" name="filter" id="button_id" disabled />
    <div id="error-warning" style="display:none" class="errorlist">Please correct the To date</div>
    <script type="text/javascript">
        $("input[type='date']").change(function(){ 
            var fromdate = document.getElementById("id_fromdate").value;
            var todate = document.getElementById("id_todate").value;

            if (Date.parse(fromdate) > Date.parse(todate)) { 
                //console.log(fromdate)
                //console.log(todate)
                    $("#error-warning").hide();
                    document.getElementById("button_id").disabled=false;   
            }else{
                //console.log(fromdate)
                //console.log(todate)
            document.getElementById("button_id").disabled=true;   
                    $("#error-warning").show();
                    $("#error-warning").text("Please correct the To date"); 
            }
        })
    </script>

boltsfrombluesky
  • 412
  • 3
  • 13
  • I checked your answer,validation is not working,button click is not happening,in console i got this error "Uncaught TypeError: Cannot set property 'disabled' of null " – Monk L Jun 28 '13 at 06:59
  • hi please check my modified code along with html. its working now i think. you may have to modify the code based on your html code .. – boltsfrombluesky Jun 28 '13 at 07:27
  • I already using a datepicker with date field,in html you again initialized the field for date field and i tried your code as the same ,submit button onclick is not happening.No errors in console i don't know whether it is working in html file or not because i directly applied the answer in my app using django framework.Will check in other html page revert you back. – Monk L Jun 28 '13 at 15:34
0

Have you tried this? https://docs.djangoproject.com/en/dev/ref/validators/

In case you want to make a validation on multiple fields you can do so in the form's clean method,so in your search form you'd have:

class SearchFilterForm(Form):

    def clean(self):
        if self.fromdate < self.todate:
            raise ValidationError('Please correct the To date')
        return self.cleaned_data

then in your view you will have:

if form.is_valid():
    ...

and in your template you can use:

{{ form.non_field_errors }}

Or instead of raising ValidationError you can manually set a field error like so:

self._errors['todate'] = 'Please correct this'

and in the template you can use:

{{form.todate.errors}}
Ciprian Tarta
  • 484
  • 5
  • 12