javascript not working on click

Question

I code am html page with javascript my code is given below

    <input type="text" id="name" name="name" value="" size="40" class="form-control"placeholder="Name*" />

    <input type="text" id="email" name="email" value="" size="40" class="form-control" placeholder="E-mail*" />

    <input type="text" id="phone" name="email-414" value="" size="40" class="form-control" placeholder="Phone*" />

    <textarea id="message" name="textarea" cols="40" rows="10" class="form-control" placeholder="Message"></textarea>

    <input type="submit" value="Send Enquiry" id="submit_mail_cont" class="btn btn-success" />

and javascript is (using jQuery)

<script type="text/javascript">
        $("#submit_mail_cont").click(function(){alert('Clicked);var name = $("#name").val();var email   = $("#email").val();var phone   = $("#phone").val();
                    var message = $("#message").val();
                    console.log(name);
                    console.log(email);
                    console.log(phone);
                    console.log(message);
                    $("body").css('cursor', 'wait');
                    if (name == "" || email == "" || phone == "" || message == "") {
                        alert("Fill All fields");
                    }else{
                        $.ajax({
                            url: 'http/url/to/my/page.php',
                            type: 'POST',
                            dataType: 'json',
                            data: {"name": name,"email": email,"phone": phone,"message": message},
                        })
                        .done(function() {
                            alert("Mail sent");
                        })
                        .fail(function() {
                            alert("Fail");
                        })
                        .always(function(){
                            $("body").css('cursor', 'auto');
                        });
                    };
                });
        </script>

the above code is working fine in my local system but while I uploaded it to server side It doesn't word. I got this error while I was debugging my code Uncaught SyntaxError: Invalid or unexpected token java script on js start tag

I didn't find error and solution.

@chigs, yes, it almost seems like this is an UTF-8 issue. What editor are you using on your local machine? — Adam
– Adam, Commented Jun 23, 2017 at 12:45

Vivek Doshi · Accepted Answer · 2017-06-23 13:01:43Z

4

Remove ; from else's closing curly brackets };

$("#submit_mail_cont").click(function()
{
    .....
    if (name == "" || email == "" || phone == "" || message == "") {
        .....  
    }
    else
    {
        .....
    // }; here you have semicolon 
    }  // remove that semicolon
});

Other error as suggested by @Reshma in the comment is:

your alert missing an ' apostrope – @Reshma

edited Jun 23, 2017 at 13:01

answered Jun 23, 2017 at 12:51

Vivek Doshi

58.8k12 gold badges120 silver badges126 bronze badges

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

Comments

Tushar Vaghela · Accepted Answer · 2017-06-23 12:52:10Z

2

You missed closing quote in alert('Clicked);

Fix that and it will work as expected.

$("#submit_mail_cont").click(function() {
    alert('Clicked');
    var name = $("#name").val();
    var email = $("#email").val();
    var phone = $("#phone").val();
    var message = $("#message").val();
    console.log(name);
    console.log(email);
    console.log(phone);
    console.log(message);
    $("body").css('cursor', 'wait');
    if (name == "" || email == "" || phone == "" || message == "") {
        alert("Fill All fields");
    } else {
        $.ajax({
                url: 'http/url/to/my/page.php',
                type: 'POST',
                dataType: 'json',
                data: {
                    "name": name,
                    "email": email,
                    "phone": phone,
                    "message": message
                },
            })
            .done(function() {
                alert("Mail sent");
            })
            .fail(function() {
                alert("Fail");
            })
            .always(function() {
                $("body").css('cursor', 'auto');
            });
    };
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="name" name="name" value="" size="40" class="form-control" placeholder="Name*" />

<input type="text" id="email" name="email" value="" size="40" class="form-control" placeholder="E-mail*" />

<input type="text" id="phone" name="email-414" value="" size="40" class="form-control" placeholder="Phone*" />

<textarea id="message" name="textarea" cols="40" rows="10" class="form-control" placeholder="Message"></textarea>

<input type="submit" value="Send Enquiry" id="submit_mail_cont" class="btn btn-success" />

answered Jun 23, 2017 at 12:52

Tushar Vaghela

1,2431 gold badge17 silver badges25 bronze badges

4 Comments

pistou Over a year ago

There is a semicolon ; that has nothing to do here on the second last line of your script (closing else statement).

chigs Over a year ago

I tried it but nothing happened. Now i can see the clicked alert but nothing else working. Also the same error is show on same place. @tushar

Tushar Vaghela Over a year ago

For me it's trying to send data to .php page. If all data is filled and show 'Fail' if any field is missing.

chigs Over a year ago

Yes I'm trying to send data to php. But it shows nothing.. Not success not fail. Data is not being sent too.

Collectives™ on Stack Overflow

javascript not working on click

2 Answers 2

Comments

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related