Farax
Farax

Reputation: 1477

Jquery not working in this code

<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<dynamic>" %>
<!DOCTYPE html>
<html>
    <head runat="server">
        <meta name="viewport" content="width=device-width" />
        <title>FillForm</title>
        <script  type="text/javascript" src="../../Scripts/jquery-1.7.1.min.js" />
         <script type="text/javascript"><![CDATA[            
             function farax() {                
                 alert($('#txt_name').val());
                 return false;
             }
        ]]></script>
    </head>
    <body>
    <div>
        <form action="DisplayCustomer" method="post">
            <span> Enter customer id :- </span> <input type="text" name="Id" id="txt_name" /> <br            />
            <span> Enter customer code :-  </span> <input type="text" name="CustomerCode" /><br />
            <span> Enter customer Amount :-  </span> <input type="text" name="Amount" /><br />
            <input type="submit" value="Submit customer data" onclick="return farax(); " />
        </form>
        </div>
    </body>    
</html>

The code above does not get the value inside the javascript function. What am i doing wrong here? This is a View in a ASP.NET MVC 4 application and I have not added any master pages. I tried using the same code inside a normal ASP.NET application and it worked fine but this seems to be skipping the javascript function altogather. Perhaps the jQuery is not loading properly. I have checked the path to see if it was faulty but that is also correct.

Upvotes: 0

Views: 119

Answers (4)

Ema.H
Ema.H

Reputation: 2878

Test this :

<script type="text/javascript">           
     function farax() {                
        alert($('#txt_name').val());
        return false;
     }
</script>

And :

<input type="submit" value="Submit customer data" onclick="console.log(farax());" />

You have to see "false" in your debugger console (maybe, check if jQuery is loaded correctly i "scripts" or put <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>).

Upvotes: 2

Farax
Farax

Reputation: 1477

<script src="../../Scripts/jquery-1.7.min.js" type="text/javascript"></script>

The odd thing was that it changing the JQuery version to 1.7 resolved my issue. I would be happy if someone can shed more light on the issue !

Thanks!

Upvotes: 1

Sean
Sean

Reputation: 1822

first, please ensure you know how to debug Javascript in browsers, in IE10/Chrome, press F12 to start debugger, and then you will find script error in console output, also you can debug the code step by step, in firefox, you can install Firebug, it's famous and powerful tool for script debugging.

then, if you get the specified error, that should be easy to fix your problem.

Upvotes: 0

Rituraj ratan
Rituraj ratan

Reputation: 10378

<input type="submit" value="Submit customer data" onclick="return farax(); " />

Change the type to type="button".

Upvotes: -2

Related Questions