Проверьте ненавязчивый Javascript - jQval не определен - PullRequest
0 голосов
/ 23 ноября 2010

Я работаю с последним файлом unobtrusive.js, который поставляется с последней установкой MVC 3 RC.

Когда я запускаю firebug, я получаю ошибку JS (хотя эта ошибка неброшено в IE)

$ jQval не определено
[Прервать на этой ошибке] parse: function (селектор) {
[строка 164]

Iдействительно не знаю, с чего начать.Я мог бы опубликовать милю своей разметки, но я не уверен, что она даст больше информации.

Вот фрагмент кода из файла, который взрывается на мне.

        if (!skipAttach) {
            valInfo.attachValidation();
        }
    },
// ***** RIGHT HERE ***** //
    parse: function (selector) {
        /// <summary>
        /// Parses all the HTML elements in the specified selector. It looks for input elements decorated
        /// with the [data-val=true] attribute value and enables validation according to the data-val-*
        /// attribute values.
        /// </summary>
        /// <param name="selector" type="String">Any valid jQuery selector.</param>
        $(selector).find(":input[data-val=true]").each(function () {
            $jQval.unobtrusive.parseElement(this, true);
        });

        $("form").each(function () {
            var info = validationInfo(this);
            if (info) {
                info.attachValidation();
            }
        });
    }
};

Вот мои теги сценариев

<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="/Extras/combrescombined.js/1"></script>
<script src="/Assets/Scripts/wmd.js" type="text/javascript"></script>
<script src="/Assets/Scripts/showdown.js" type="text/javascript"></script>
<script src="http://ajax.microsoft.com/ajax/jquery.validate/1.7/jquery.validate.min.js" type="text/jscript"></script>
<script src="/Assets/Scripts/jquery.validate.unobtrusive.js" type="text/javascript"></script>

По сути, когда я отправляю неверную форму, форма отправляется на сервер, а сервер возвращает недопустимые флаги.Проверка на стороне клиента не происходит.

edit

И если вас волнует ... вот полная разметка страницы

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title> Add An Event! - My App</title>
    <meta charset="UTF-8" />

<link href="/Assets/Css/wmd.css" rel="stylesheet" type="text/css" />

    <link rel="search" type="application/opensearchdescription+xml" title="My App" href="/assets/xml/opensearch.xml" />
    <link rel="stylesheet" type="text/css" href="/Extras/siteMaster.Css/1"/>
</head>
<body>

    <div class="page">
        <div id="header">
            <div id="title">
                <div id="my-app-logo">
                    <a href="/" title="My App"><span>My App</span></a>
                </div>
            </div>

            <div id="logindisplay">

                <ul id="logindisplaywrapper">
                        <li><a href="/users/1/rockinthesixstring">rockinthesixstring</a></li>
                        <li>|</li>
                        <li><a href="/#" title="Change Region" class="RegionWindow">Calgary</a></li>
                        <li>|</li>
                        <li><a href="/about">about</a></li>

                        <li>|</li>
                        <li><a href="/about/faq">faq</a></li>
                        <li>|</li>
                        <li><a href="/users/logout?go=/events/add" id="logout-opener">log out</a></li>
                        <li><form action="/search" id="searchForm" method="get"><input id="search-text" name="q" tabindex="1" type="text" maxlength="80" size="28" placeholder="search..." /></form></li>
                </ul>
            </div>

            <div id="menucontainer">
                <div class="floatleft">
                    <ul class="menu">
                        <li><a href="/">Now</a></li>
                        <li><a href="/events/coming">Coming</a></li>
                        <li><a href="/events/hot">Hot</a></li>
                        <li><a href="/tags">Tags</a></li>

                        <li><a href="/users">Users</a></li>
                    </ul>
                </div>
                <div class="floatright">
                    <ul class="menu">
                        <li><a class="youarehere" href="/events/add">Add Event</a></li>
                    </ul>
                </div>

            </div>
        </div>
        <div class="clear"></div>
        <div id="main">
               <h1> Add An Event!</h1>
            <hr />
            <div id="innermain">





<h2>Add</h2>
<form action="/events/add" method="post">    <fieldset><legend>Fields</legend>
        <div class="editor-field">
            <input data-val="true" data-val-number="The field UserID must be a number." data-val-required="The UserID field is required." id="UserID" name="UserID" type="hidden" value="1" />
        </div>
        <div class="editor-field">
            <input data-val="true" data-val-number="The field RegionID must be a number." data-val-required="The RegionID field is required." id="RegionID" name="RegionID" type="hidden" value="365" />
        </div>

        <div class="editor-label">
            <label for="Title">title</label>
        </div>
        <div class="editor-field">
            <input class="full-width-input" data-val="true" data-val-length="Username cannot exceed 50 characters." data-val-length-max="50" data-val-required="Title is required." id="Title" name="Title" type="text" value="" /> <span class="field-validation-valid" data-valmsg-for="Title" data-valmsg-replace="false">*</span>
        </div>
        <div class="editor-label">

            <label for="Location">location</label>
        </div>
        <div class="editor-field">
            <input class="text-box single-line" data-val="true" data-val-length="Location cannot exceed 100 characters" data-val-length-max="100" data-val-required="Location is required" id="Location" name="Location" type="text" value="" /> <span class="field-validation-valid" data-valmsg-for="Location" data-valmsg-replace="false">*</span>
        </div>
        <div class="editor-label">
            <label for="Address">address</label>

        </div>
        <div class="editor-field">
            <input class="text-box single-line" data-val="true" data-val-length="Address is too long" data-val-length-max="100" data-val-required="Address is required" id="Address" name="Address" type="text" value="" /> <span class="field-validation-valid" data-valmsg-for="Address" data-valmsg-replace="false">*</span>
        </div>
        <div class="editor-field">
            <input data-val="true" data-val-number="The field DownVotes must be a number." data-val-required="The DownVotes field is required." id="DownVotes" name="DownVotes" type="hidden" value="0" />
        </div>
        <div class="editor-field">

            <input data-val="true" data-val-number="The field UpVotes must be a number." data-val-required="The UpVotes field is required." id="UpVotes" name="UpVotes" type="hidden" value="0" />
        </div>
        <div class="editor-label">
            <label for="Description">description</label> <span class="field-validation-valid" data-valmsg-for="Description" data-valmsg-replace="false">*</span>
        </div>
        <div class="editor-field">
            <noscript><h3>Please use <a href="/about/markdown">Markdown</a> to style your input.</h3></noscript>

            <div id="wmd-button-bar" class="wmd-panel">
            </div>
            <textarea class="wmd-panel" cols="10" data-val="true" data-val-length="Description is too long" data-val-length-max="2048" data-val-required="Description is required" id="wmd-input" name="Description" rows="5">
</textarea>
            <div id="wmd-preview" class="wmd-panel">
            </div>
            <div class="clear">
            </div>
        </div>

        <div class="editor-label">
            <label for="StartDateTime">start date</label>
        </div>
        <div class="editor-field">
            <input class="text-box single-line" data-val="true" data-val-required="Start Date is required" id="StartDateTime" name="StartDateTime" type="text" value="11/23/2010" /> <span class="field-validation-valid" data-valmsg-for="StartDateTime" data-valmsg-replace="false">*</span>
        </div>
        <div class="editor-label">

            <label for="EndDateTime">end date</label>
        </div>
        <div class="editor-field">
            <input class="text-box single-line" id="EndDateTime" name="EndDateTime" type="text" value="11/23/2010" /> <span class="field-validation-valid" data-valmsg-for="EndDateTime" data-valmsg-replace="false">*</span>
        </div>
        <div class="editor-label">
            <label for="Latitude">latitude</label>

        </div>
        <div class="editor-field">
            <input class="text-box single-line" data-val="true" data-val-number="The field latitude must be a number." data-val-required="Latitude is required" id="Latitude" name="Latitude" type="text" value="0.00" /> <span class="field-validation-valid" data-valmsg-for="Latitude" data-valmsg-replace="false">*</span>
        </div>
        <div class="editor-label">
            <label for="Longitude">longitude</label>
        </div>

        <div class="editor-field">
            <input class="text-box single-line" data-val="true" data-val-number="The field longitude must be a number." data-val-required="Longitude is required" id="Longitude" name="Longitude" type="text" value="0.00" /> <span class="field-validation-valid" data-valmsg-for="Longitude" data-valmsg-replace="false">*</span>
        </div>
        <div class="editor-label">
            <label for="URL">website</label>
        </div>
        <div class="editor-field">

            <input class="text-box single-line" data-val="true" data-val-regex="Not a valid website address." data-val-regex-pattern="^http(s?)\://[a-zA-Z0-9\-\.]+\.[a-zA-Z]{2,3}(/\S*)?$" id="URL" name="URL" type="text" value="" /> <span class="field-validation-valid" data-valmsg-for="URL" data-valmsg-replace="false">*</span>
        </div>
        <div class="editor-label">
            <label for="Phone">phone number</label>
        </div>
        <div class="editor-field">
            <input class="text-box single-line" id="Phone" name="Phone" type="text" value="" /> <span class="field-validation-valid" data-valmsg-for="Phone" data-valmsg-replace="false">*</span>

        </div>
        <div class="editor-label">
            <label for="TicketPriceLow">lowest ticket price</label>
        </div>
        <div class="editor-field">
            <input class="text-box single-line" data-val="true" data-val-number="The field lowest ticket price must be a number." id="TicketPriceLow" name="TicketPriceLow" type="text" value="" /> <span class="field-validation-valid" data-valmsg-for="TicketPriceLow" data-valmsg-replace="false">*</span>
        </div>

        <div class="editor-label">
            <label for="TicketPriceHigh">highest ticket price</label>
        </div>
        <div class="editor-field">
            <input class="text-box single-line" data-val="true" data-val-number="The field highest ticket price must be a number." id="TicketPriceHigh" name="TicketPriceHigh" type="text" value="" /> <span class="field-validation-valid" data-valmsg-for="TicketPriceHigh" data-valmsg-replace="false">*</span>
        </div>
        <div class="editor-field">

            <input data-val="true" data-val-required="The date posted field is required." id="DatePosted" name="DatePosted" type="hidden" value="11/23/2010 7:13:58 AM" />
        </div>
        <script type="text/javascript">
        var RecaptchaOptions = {
            theme : 'clean',
            tabindex : 0
        };

</script><script type="text/javascript" src="http://www.google.com/recaptcha/api/challenge?k=6LdF974SAAAAAEY2Ujhga1mvtU3wAd97Ag9VgwLZ">

</script><noscript>
        <iframe src="http://www.google.com/recaptcha/api/noscript?k=6LdF974SAAAAAEY2Ujhga1mvtU3wAd97Ag9VgwLZ" width="500" height="300" frameborder="0">

        </iframe><br /><textarea name="recaptcha_challenge_field" rows="3" cols="40"></textarea><input name="recaptcha_response_field" value="manual_challenge" type="hidden" />
</noscript> <p>
            <input type="submit" value="Create" /> 
            <div class="validation-summary-valid" data-valmsg-summary="true"><span>Oops!, please correct the errors...</span>
<ul><li style="display:none"></li>
</ul></div>
        </p>

    </fieldset>
</form><div>
</div>


            </div>
            <div id="footer">
                <ul id="footernavigation">
                    <li>&#169; 2010 - <a href="/">My App</a> - All Rights Reserved</li>

                    <li><span class="colorgreen increasesize-140">&#9632;</span>
                        <a href="/about">about</a>
                        | <span class="colorgreen increasesize-140">&#9632;</span>
                        <a href="/about/faq">faq</a>
                        | <span class="colorgreen increasesize-140">&#9632;</span>
                        <a href="/about/advertise">advertise</a>

                        | <span class="colorgreen increasesize-140">&#9632;</span>
                        <a href="/about/legal">legal</a></li>
                </ul>
            </div>
        </div>
    </div>
    <div id="dialog-confirm" title="Log Out">
        <div class="alert" title="Alert"></div>

        &#160;&#160;Are you sure?
    </div>
    <script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery/jquery-1.4.4.min.js"></script>

    <script type="text/javascript" src="/Extras/MyApp.js/1"></script>

<script src="/Assets/Scripts/wmd.js" type="text/javascript"></script>
<script src="/Assets/Scripts/showdown.js" type="text/javascript"></script>
<script src="http://ajax.microsoft.com/ajax/jquery.validate/1.7/jquery.validate.min.js" type="text/jscript"></script>
<script src="/Assets/Scripts/jquery.validate.unobtrusive.js" type="text/javascript"></script>

</body>
</html>

И, наконец, если выГуру MVC, вот мой просмотр содержимого

@ModelType MyApp.Core.Domain.Event
@Section TitleContent Add An Event!End Section
@Section MainTitle Add An Event!End Section
@section HeaderContent
<link href="@MvcHtmlString.Create(Url.Content("~/Assets/Css/wmd.css"))" rel="stylesheet" type="text/css" />
End Section
<h2>Add</h2>
@Using Html.BeginForm()
    @<fieldset><legend>Fields</legend>
        <div class="editor-field">
            @Html.EditorFor(Function(model) model.UserID)
        </div>
        <div class="editor-field">
            @Html.EditorFor(Function(model) model.RegionID)
        </div>
        <div class="editor-label">
            @Html.LabelFor(Function(model) model.Title)
        </div>
        <div class="editor-field">
            @Html.TextBoxFor(Function(model) model.Title, New With {.class = "full-width-input"}) @Html.ValidationMessage("Title", "*")
        </div>
        <div class="editor-label">
            @Html.LabelFor(Function(model) model.Location)
        </div>
        <div class="editor-field">
            @Html.EditorFor(Function(model) model.Location) @Html.ValidationMessage("Location", "*")
        </div>
        <div class="editor-label">
            @Html.LabelFor(Function(model) model.Address)
        </div>
        <div class="editor-field">
            @Html.EditorFor(Function(model) model.Address) @Html.ValidationMessage("Address", "*")
        </div>
        <div class="editor-field">
            @Html.EditorFor(Function(model) model.DownVotes)
        </div>
        <div class="editor-field">
            @Html.EditorFor(Function(model) model.UpVotes)
        </div>
        <div class="editor-label">
            @Html.LabelFor(Function(model) model.Description) @Html.ValidationMessage("Description", "*")
        </div>
        <div class="editor-field">
            <noscript><h3>Please use @Html.ActionLink("Markdown", "Markdown", "About") to style your input.</h3></noscript>
            <div id="wmd-button-bar" class="wmd-panel">
            </div>
            @Html.TextAreaFor(Function(model) model.Description, 5, 10, New With {.id = "wmd-input", .class = "wmd-panel"})
            <div id="wmd-preview" class="wmd-panel">
            </div>
            <div class="clear">
            </div>
        </div>
        <div class="editor-label">
            @Html.LabelFor(Function(model) model.StartDateTime)
        </div>
        <div class="editor-field">
            @Html.EditorFor(Function(model) model.StartDateTime) @Html.ValidationMessage("StartDateTime", "*")
        </div>
        <div class="editor-label">
            @Html.LabelFor(Function(model) model.EndDateTime)
        </div>
        <div class="editor-field">
            @Html.EditorFor(Function(model) model.EndDateTime) @Html.ValidationMessage("EndDateTime", "*")
        </div>
        <div class="editor-label">
            @Html.LabelFor(Function(model) model.Latitude)
        </div>
        <div class="editor-field">
            @Html.EditorFor(Function(model) model.Latitude) @Html.ValidationMessage("Latitude", "*")
        </div>
        <div class="editor-label">
            @Html.LabelFor(Function(model) model.Longitude)
        </div>
        <div class="editor-field">
            @Html.EditorFor(Function(model) model.Longitude) @Html.ValidationMessage("Longitude", "*")
        </div>
        <div class="editor-label">
            @Html.LabelFor(Function(model) model.URL)
        </div>
        <div class="editor-field">
            @Html.EditorFor(Function(model) model.URL) @Html.ValidationMessage("URL", "*")
        </div>
        <div class="editor-label">
            @Html.LabelFor(Function(model) model.Phone)
        </div>
        <div class="editor-field">
            @Html.EditorFor(Function(model) model.Phone) @Html.ValidationMessage("Phone", "*")
        </div>
        <div class="editor-label">
            @Html.LabelFor(Function(model) model.TicketPriceLow)
        </div>
        <div class="editor-field">
            @Html.EditorFor(Function(model) model.TicketPriceLow) @Html.ValidationMessage("TicketPriceLow", "*")
        </div>
        <div class="editor-label">
            @Html.LabelFor(Function(model) model.TicketPriceHigh)
        </div>
        <div class="editor-field">
            @Html.EditorFor(Function(model) model.TicketPriceHigh) @Html.ValidationMessage("TicketPriceHigh", "*")
        </div>
        <div class="editor-field">
            @Html.EditorFor(Function(model) model.DatePosted)
        </div>
        @MvcHtmlString.Create(Html.reCaptcha) <p>
            <input type="submit" value="Create" /> @ViewData("isvalid")
            @Html.ValidationSummary("Oops!, please correct the errors...")
        </p>
    </fieldset>
End Using
<div>
</div>
@Section BelowCombres
<script src="@MvcHtmlString.Create(Url.Content("~/Assets/Scripts/wmd.js"))" type="text/javascript"></script>
<script src="@MvcHtmlString.Create(Url.Content("~/Assets/Scripts/showdown.js"))" type="text/javascript"></script>
<script src="http://ajax.microsoft.com/ajax/jquery.validate/1.7/jquery.validate.min.js" type="text/jscript"></script>
<script src="@MvcHtmlString.Create(Url.Content("~/Assets/Scripts/jquery.validate.unobtrusive.js"))" type="text/javascript"></script>
End Section

1 Ответ

1 голос
/ 24 ноября 2010

Нашел проблему

type="text/jscript"

Должно быть

type="text/javascript"
...