Disabling the form element using JavaScript

Question

I have a form like this: -

<form id="form" name="form" action="banner_ad_post.php" method="post" enctype="multipart/form-data">
                <p>
                  <label for="banner_name"><font color="#FF0000"> * </font>Banner Name: </label>
                  <input type="text" name="banner_name" id="banner_name" value="" maxlength="100" required="required"/>
                </p>
                <p>
                  <label for="Banner_website_url"><font color="#FF0000"> * </font>Banner website Url: </label>
                  <input type="url" name="banner_site_url" id="banner_site_url" value="" maxlength="100" required="required"/>
                </p>

                <p>
                  <label for="banner_image_url">Banner Image Url: </label>
                  <input type="file" name="file" id="file" value="" accept="image" placeholder="Browse from hard disk" onchange="img_path()"/> &nbsp;
                   <font color="#FF0000"> OR</font> &nbsp;
                  <input type="url" name="banner_image_url" id="banner_image_url" value="" maxlength="100" placeholder="Enter the url from website." onchange="validate()"/> &nbsp; 


                </p>
                <p>
                <label for="submit"> </label>
                  <input type="submit" id="submit" name="submit" value="Submit" />
                </p>
              </form>

And the JavaScript code like : -

<script>

    function validate()
    {
    var banner_name=document.getElementById("banner_name");
    var banner_site_url=document.getElementById("banner_site_url");
    var banner_file=document.getElementById("file");
    var banner_image_url=document.getElementById("banner_image_url");
    //var x=banner_file.value;
    //var y=banner_image_url.value;
    if((banner_file.value=true) && (banner_image_url.value=true))
        {
        alert("Please choose only one field either url or image uploading.");
        document.getElementById("form").reset();

        }
    }

    function img_path()
    {
    var file_path=document.getElementById('file').value;
    if(file_path.match(".jpeg$")==".jpeg" || file_path.match(".gif$")==".gif" || file_path.match(".GIF$")==".GIF" || file_path.match(".JPEG$")  ==".JPEG" || file_path.match(".JPG$")==".JPG" ||file_path.match(".jpg$")==".jpg" || file_path.match(".png$")==".png" || file_path.match(".PNG$")==".PNG")
    {
      return true;
    }
   else
   {
   alert("Upload  .jpg/.gif/png  file olny");
   document.getElementById("form").reset();
   return false;
   }

}
</script>

Now, the problem is that, whenever I am trying to enter the only image url in the form. It generates an alert message stating " (Please choose only one field either url or image uploading) ". But according to my definition the message should have to be displayed only when both the filed banner_image_url and file are set true.

Any help will be appreciated...
Thanx in advance.

There are probably more problems, but the first thing that pops up for me is that banner_file.value=true is an assignment, not a comparison. You need == instead. — Wolfgang Stengel
– Wolfgang Stengel, Commented Nov 24, 2012 at 19:19
You're using assignment (=) when you should use equality operator(==) : if((banner_file.value=true) && (banner_image_url.value=true)) — onon15
– onon15, Commented Nov 24, 2012 at 19:20

Ben · Accepted Answer · 2012-11-24 19:19:55Z

3

You need to use == instead of =

if((banner_file.value==true) && (banner_image_url.value==true))

answered Nov 24, 2012 at 19:19

Ben

68.9k38 gold badges88 silver badges108 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Hare Kumar Over a year ago

hey Ben! it is still not working. Now the problem is even more complex.The alert message is not popping at all even after providing both the fields.

user1726343 Over a year ago

+1, but you could also add an explanation of why ==true is unnecessary.

score 1 · Accepted Answer · 2012-11-24 19:39:08Z

1

Doing this:

banner_file.value=true

sets the value of banner_file.value, and returns true, unconditionally.

This is not what you want, since you want to check the existing value of banner_file.value.

On the other hand, doing this:

banner_file.value==true

returns true only if the value of banner_file.value evaluates to true. This is what you want to do.

Try it with the following changes:

if((banner_file.value) && (banner_image_url.value))

edited Nov 24, 2012 at 19:39

answered Nov 24, 2012 at 19:20

user1726343

Comments

Joe Dyndale · Accepted Answer · 2012-11-24 19:37:15Z

0

This:

if((banner_file.value=true) && (banner_image_url.value=true))

should be:

if((banner_file.value == true) && (banner_image_url.value == true))

because, in your code you are setting the variable to true instead of checking if it is true. But if you want as little code as possible you could write:

if(banner_file.value && banner_image_url.value)

Explicitly testing for == true is redundant - but it can make the code more readable for some. Just thought I'd mention it in case you found the last example to be cleaner :)

edited Nov 24, 2012 at 19:37

answered Nov 24, 2012 at 19:20

Joe Dyndale

1,0711 gold badge15 silver badges32 bronze badges

3 Comments

Joe Dyndale Over a year ago

Others beat me to it I see :)

Wolfgang Stengel Over a year ago

Is it really boolean true, though?

Joe Dyndale Over a year ago

@WolfgangStengel Nope, of course not. Sorry. Fixed it now. I've gotten a little too used to using === automatically I see :)

Collectives™ on Stack Overflow

Disabling the form element using JavaScript

3 Answers 3

2 Comments

Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related