This question is locked. New answers and comments are not allowed.
Narayanarao
Top achievements
Rank 1
Narayanarao
asked on 16 Dec 2011, 07:57 AM
Hi telerik team,
I have tried numerous countless attempts to have a working validation on model popup window but in vain. I can see that in the html rendered the validation message appears, but never fire for that intended control on entering invalid data.
The model(s) are decorated with validation attributes and then bound onto the textfor and validationfor controls on view.
all of the below are tried. Please find inline the code of the model window.
1. adding
2.
3. adding this to model window form as well as at view beginning
Thanks.
I have tried numerous countless attempts to have a working validation on model popup window but in vain. I can see that in the html rendered the validation message appears, but never fire for that intended control on entering invalid data.
The model(s) are decorated with validation attributes and then bound onto the textfor and validationfor controls on view.
all of the below are tried. Please find inline the code of the model window.
1. adding
<script src="@Url.Content("~/Scripts/MicrosoftAjax.js")" type="text/javascript"></script> <script src="@Url.Content("~/Scripts/MicrosoftMvcAjax.js")" type="text/javascript"></script> <script src="@Url.Content("~/Scripts/MicrosoftMvcValidation.js")" type="text/javascript"></script>
2.
@{ Html.Telerik().ScriptRegistrar().DefaultGroup(group => group .Add("MicrosoftAjax.js") .Add("MicrosoftMvcValidation.js"))
3. adding this to model window form as well as at view beginning
@{ Html.EnableClientValidation(); }
-- DELETED SNIPPET --
6 Answers, 1 is accepted
0
Hi Narayanarao,
To use client-side form validation you should include three JavaScript files to the head section of your page:
Best wishes,
Daniel
the Telerik team
To use client-side form validation you should include three JavaScript files to the head section of your page:
- jquery-1.6.4.min.js
- jquery.validate.min.js
- jquery.validate.unobtrusive.min.js
Html.Telerik().ScriptRegistrar().jQuery(false).jQueryValidation(false)
Best wishes,
Daniel
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the Telerik Extensions for ASP.MET MVC, subscribe to their blog feed now
0
Michael Dosen
Top achievements
Rank 1
answered on 01 Feb 2012, 05:54 PM
Thank you for your help! that was exactly what I needed...
0
Steven
Top achievements
Rank 1
answered on 16 Mar 2012, 08:57 PM
Hello,
I have tried everything specified above and it still does not work. When I use the following for ScriptRegistrar and look at the html, it is still including jquery.validate.min.js.
I am including the following script files and Html.EnableClientValidation() in my view.
The window is defined as follows:
And is opened using javascript when a button is pressed.
Any ideas how to get validation to work? It will work fine outside the window so I know I have the correct js files included.
Thank You
I have tried everything specified above and it still does not work. When I use the following for ScriptRegistrar and look at the html, it is still including jquery.validate.min.js.
@(Html.Telerik().ScriptRegistrar().jQuery(false).jQueryValidation(false)
.DefaultGroup(group => group
.Compress(true))
)
I am including the following script files and Html.EnableClientValidation() in my view.
<
script
src
=
"@Url.Content("
http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.7.1.min.js")"
type
=
"text/javascript"
></
script
>
<
script
src
=
"@Url.Content("
http://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/jquery.validate.min.js")"
type
=
"text/javascript"
></
script
>
<
script
src
=
"@Url.Content("
http://ajax.aspnetcdn.com/ajax/mvc/3.0/jquery.validate.unobtrusive.min.js")"
type
=
"text/javascript"
></
script
>
<
script
src
=
"@Url.Content("
http://ajax.aspnetcdn.com/ajax/mvc/3.0/jquery.unobtrusive-ajax.min.js")"
type
=
"text/javascript"
></
script
>
<
script
src
=
"@Url.Content("
~/Scripts/MicrosoftAjax.js")"
type
=
"text/javascript"
></
script
>
<
script
src
=
"@Url.Content("
~/Scripts/MicrosoftMvcAjax.js")"
type
=
"text/javascript"
></
script
>
<
script
src
=
"@Url.Content("
~/Scripts/MicrosoftMvcValidation.js")"
type
=
"text/javascript"
></
script
>
@(Html.Telerik().Window()
.Name("Details")
.Visible(false)
.Title("User Details")
.Modal(true)
.Buttons(buttons => buttons.Close())
.Scrollable(false)
.ClientEvents(events => events
.OnActivate("onActivate"))
)
function viewDetails(userId) {
$.ajax({
type: 'POST',
url: '/User/ViewDetails',
data: { userId: userId },
dataType: 'html',
success: function (htmlData)
{
var detailWindow = $("#Details").data("tWindow");
detailWindow.content(htmlData);
detailWindow.center().open();
},
error: function () {
alert("Error loading User Details");
}
})
}
0
Hello Steven,
Please check the Common Validation Problems code library for information and example on how to enable validation for forms loaded with Ajax.
Greetings,
Daniel
the Telerik team
Please check the Common Validation Problems code library for information and example on how to enable validation for forms loaded with Ajax.
Greetings,
Daniel
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the Telerik Extensions for ASP.MET MVC, subscribe to their blog feed now.
0
Steven
Top achievements
Rank 1
answered on 20 Mar 2012, 04:27 PM
Thank you. I checked that out but it still doesn't work. I added the client events to my tabstrip but the onContentLoad is never called. Is this my problem?
@using (Html.BeginForm("SubmitUser", "User", FormMethod.Post, new { user = "user-form", name = "SubmitUser" }))
{
@Html.ValidationSummary()
@(Html.Telerik().TabStrip()
.Name("UserTabStrip")
.SelectedIndex(0)
.ClientEvents(events => events.OnContentLoad("onContentLoad"))
.HtmlAttributes(new { style = "width:920px" })
.Items(items =>
{
<
script
type
=
"text/javascript"
>
function submitDetails(userId) {
$.ajax({
type: 'POST',
url: '/User/ViewDetails',
data: { userId: userId },
dataType: 'html',
success: function (htmlData) {
$.validator.unobtrusive.parse(e.contentElement);
var detailWindow = $("#Details").data("tWindow");
detailWindow.content(htmlData);
detailWindow.center().open();
}
})
}
function onCancelDetails() {
alert("onCancelDetails");
var detailWindow = $("#Details").data("tWindow");
detailWindow.close();
}
function onSubmitUser() {
var tabStrip = $("#UserTabStrip").data("tTabStrip");
tabStrip.select($(".t-item", tabStrip.element)[0]);
}
function onContentLoad(e) {
alert("onContentLoad");
$.validator.unobtrusive.parse(e.contentElement);
}
</
script
>
0
Hello again Steven,
I am not sure if I understand the exact scenario. Could you clarify? Are the tab's loaded on demand or their content is rendered on the server? Is the form loaded in the Window or in a tab? Are there editable Grid's on the page?
If the form is loaded in the Window via an Ajax request, you should use the parse method on the content wrapper after you set the content e.g.
All the best,
Daniel
the Telerik team
I am not sure if I understand the exact scenario. Could you clarify? Are the tab's loaded on demand or their content is rendered on the server? Is the form loaded in the Window or in a tab? Are there editable Grid's on the page?
If the form is loaded in the Window via an Ajax request, you should use the parse method on the content wrapper after you set the content e.g.
$.ajax({
type:
'POST'
,
url:
'/User/ViewDetails'
,
data: { userId: userId },
dataType:
'html'
,
success:
function
(htmlData) {
var
detailWindow = $(
"#Details"
).data(
"tWindow"
);
detailWindow.content(htmlData);
$.validator.unobtrusive.parse($(detailWindow.element).find(
'.t-window-content'
));
detailWindow.center().open();
}
})
All the best,
Daniel
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the Telerik Extensions for ASP.MET MVC, subscribe to their blog feed now.