Need quick help with javascript

Question

0.00/5 (No votes)

See more:

Alright so, this is how my looks like:

http://puu.sh/jBcjs/f379e46bf0.png[^]

I have a script so when I check the checkbox my Datum: frield will automatically get updated if I check more than 1 date it will looks like this:

YYMMDD YYMMDD YYMMDD

But the problem is, I can't choose any date.
If I want to choose any date at all I'll need to select the first date first, and than the other dates.

So this doesn't work:
http://puu.sh/jBcoI/286fd5b4b4.png[^]

But if I select the first date it works as can be seen here:
http://puu.sh/jBcq8/d5b1bac434.png[^]

this is my script.

JavaScript

function SetDate(dt) {
       if(document.getElementById("isoDate").checked) {
           if(dateArr.indexOf(dt)<0){ //Check if date is already added. if not add it to array.
              dateArr.push(dt);
        }
        else{
             var index=dateArr.indexOf(dt);
             if (index > -1) {
                dateArr.splice(index, 1);//Remove from array if checkbox uncheck
        }
      }
         $('#date').val(dateArr.join(" ")); //Add space separated string to the #date element.
     }
    }

And this is my view where I get the dates

HTML

@foreach (var date in ViewBag.MissingDays)
                                            {
                                                var isoDate = date.ToString("yyMMdd");
                                                <div class="col-md-1">
                                                    <input type="checkbox" id="isoDate" name="isoDate" value="@isoDate"onclick="javascript:SetDate('@isoDate');" />
                                                    @isoDate
                                                </div>
                                            }

Posted 14-Aug-15 2:03am

Joakim Carlsson

Updated 14-Aug-15 2:16am

CHill60

v2

Add a Solution

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

xszaboj · Answer 1 · 2015-08-14T04:40:00

Hi, problem is that you have multiple elements with id="isoDate", that is not possible if you want to process it. Use class instead ;). This way you always only check first element! and that is reason why it work when first box is checked.

I've created simple pen here:
http://codepen.io/xszaboj/pen/RPOEGP?editors=101[^]

Of course you have to edit it to your needs, but it should provide the simple idea behind on click event and how to use it properly.

Do not use this: onclick="javascript:SetDate('@isoDate');" !!!

It will create event for every on of your checkbox in your case a lot. Try to catch it rather on parent element. in my demo #parent.
then in click event by using $(this) you will get element you clicked on, that way you will get value of element (date) and you can check if you have this date already in some global array.