I have a simple Kendo MVC File Upload control. I want to restrict the file size and file type. Please find my code below:
<div>
#(Html.Kendo().Upload()
.Name("files123")
.Async(a => a
.Save("Save", "Upload")
.Remove("Remove", "Upload")
.SaveField("files")
)
.Validation(validation => validation.AllowedExtensions(new string[] { ".pdf" }))
)
</div>
When I select an invalid format, it goes to the controller and the validation never gets fired.
I have spent considerable amount of time on this and could not find out any thing as nothing is happening.
Any inputs would be really helpful.
Kendo Upload validation is added after Kendo R3, 2016 release.
Here is the link:
http://docs.telerik.com/kendo-ui/controls/editors/upload/validation
Related
can anybody tell me how to configure my kendo grid that it uses a
x-kendo-template?
The documentation only shows the set up for using client side technology:
http://demos.telerik.com/kendo-ui/grid/toolbar-template
I expect something like this:
.ToolBar(tb=>tb.Template(..some stuff here...))
thx
I don't think you can use the x-kendo-template blocks server-side as they are actually "compiled" into a kendo template via kendo.template() in javascript before using them.
But what you can do is include more razor in the Grid's ToolBar template:
.ToolBar(t => t.Template(#<text>
#(Html.Kendo().ToolBar()
.Name("toolbar")
.Items(items =>
{
items.Add().Type(CommandType.Button).Text("X").Id("X");
items.Add().Type(CommandType.Button).Text("Y").Id("Y");
})
)
</text>))
Or
.ToolBar(t => t.Template(Html.Partial("_ToolBar").ToHtmlString()))
or whatever razor code you want to use.
My company has a license for one of the older Telerik packages. They would like me to place an RTF textbox in place of the normal Textbox on one of our screens. I have the extant code for the text box and I have another page used in our application which ostensibly works with the RTF editor (it's a part of functionality which is inaccessible to me at my privilege level). The original code was as follows:
#Html.TextAreaFor(m => m.LogEntry.Description,
new { #id = "logDescription", #class = "dirtyField",
style = "width: 400px; height: 100px;" })
The RTF code I'm patterning my code off of is as follows:
#(Html.Telerik().EditorFor(m => m.MessageContent)
.Name("msgEditor")
.HtmlAttributes(new { style = "width: 600px; height:250px; padding-top:0px; padding-bottom:0px;" })
.Tools(tools => tools
.Clear()
.Bold().Italic().Underline().Strikethrough()
.JustifyLeft().JustifyCenter().JustifyRight().JustifyFull()
.InsertUnorderedList().InsertOrderedList()
.Outdent().Indent()
.CreateLink().Unlink()
.Subscript()
.Superscript()
.FontName()
.FontSize()
.FontColor().BackColor()
)
)
I have the Editor control displaying, using our LogEntry.Description string instead of the above MessageContent. I can input text into it. I can load text into it. But when I try to save the entry off of a procedure called by a button in the dialog, the text of Description has been set to NULL. What am I doing wrong? I'm a newbie when it comes to web development, so I'm sort of grasping at straws.
I've looked at the answer at Telerik Editor doesn't work, but we have a ScriptRegistrar set up. The tutorials I can find on the Telerik site are all for the Kendo editor. This page seems more applicable, but, as far as I can tell, I'm doing all of the same things as they are. I tried to figure out if there was a place I needed to insert a call to HTMLEncode or HTMLDecode, but I've yet to find where the value is getting changed to NULL so as to catch it before then. Unfortunately, company code and all of that, I can only post so much of it, although I'll do my best to post sanitized specifics as necessary.
For the sake of future people who have this issue, I hashed it out with one of the programmers here who had access to some additional code that had been published, but not added to our source code. I had to add code similar to the following inside the code run for the Javascript code associated with the Save button:
var editor = $("#descriptionEditor").data("tEditor");
var message = editor.value();
$("#logentry-encoded-message-content").val(message);
Within the CSHTML file, had to add the following element:
#Html.HiddenFor(m => m.LogEntry.EncodedDescription, new { #id = "logentry-encoded-message-content" })
Then, in the code involving processing the form, I assigned the contents of EncodedDescription to Description. Rather annoyingly, I have yet to find a way to just use one variable here. I did also have to add a modifier of [AllowHtml] to the EncodedDescription property to avoid the error message that there is potentially dangerous HTML being posted (since I know exactly what is being posted, and I know that it will be decoded and encoded for the control).
I have a small form which needs validation summary, but this validation summary should be definitly placed on another form.
I know, that there is a restriction - validation summary checks only elements in current form, so what am i searching for is some kind of crunch.
Is there any solution which does nt involve writing own validation and hundreds of lines of Javascript?
There's little information you gave about what are these forms and how they are related or why would you need to move that validation information. Plus lets get thing straight : validation summary doesn't check anything it only displays summary of validation errors. You're right though, summary is presented for the parent form only. If you really wan't to move the summary from one form to another you may want to bind to submit() event and using jquery move the .validation-summary-errors element to the other form.
it is not possible to solve this problem with standart events: before submit event triggered "validate" method Validation Summary is not present on page and callint "validate" stops event dispatching (if you have any errors of cause).
What have i done involves edititng of "jquery.validate.unobtrusive.js". Steps:
1) In "jquery.validate.unobtrusive.js" file in function onErrors I added event dispatching:
function onErrors(form, validator) {
// native code
jQuery("#submitErrorProxy").trigger(jQuery.Event("click")); // my event
}
2) Added hidden input on my form with id="submitErrorProxy"
3) added div container on place where Validation Summary should be displayed.
<div class="form-line" id="validationSummaryContainer">
//validation summary should be moved here
</div>
4) Added next Javascipt method
$("#submitErrorProxy").click(function (e) {
$("#validationSummaryContainer").empty();
$(".validation-summary-errors").clone(true, true)
.appendTo("#validationSummaryContainer");
});
Where clone(true, true) - makes copy of chosen element with all its child elements. And appendTo used instead of move because original validaton summary should be present on original form.
5) Hidden original ValidtionSummary container.
<div class="form-line" style="visibility: hidden; height: 0px">
#Html.ValidationSummary(false)
</div>
I'm requesting an ASP.net MVC view into a live box and the view contains form fields that have been marked up with attributes to be used by JQuery's unobtrusive validators plug-in.
The client script is not however working and my theory is that its because the validation framework is only being triggered on page load which has long since passed by the time the MVC view has been loaded into the live box.
Thus how can I let the validation framework know that it has new form fields to fix up?
Cheers, Ian.
var $form = $("form");
$form.unbind();
$form.data("validator", null);
$.validator.unobtrusive.parse(document);
// Re add validation with changes
$form.validate($form.data("unobtrusiveValidation").options);
You may take a look at the following blog post. And here's another one.
Another option, rather trick, which worked for me. Just add following line in the beginning of the partial view which is being returned by ajax call
this.ViewContext.FormContext = new FormContext();
Reference
For some reason I had to combine bjan and dfortun's answers...
So I put this in my view:
#{
this.ViewContext.FormContext = new FormContext();
}
And this execute this after the ajax call finishes:
var form = $("#EnrollmentForm");
form.unbind();
form.data("validator", null);
$.validator.unobtrusive.parse(document);
form.validate(form.data("unobtrusiveValidation").options);
I had a similar issue. I had a form that was using Ajax requests to re-display a part of the form with different form fields. I used unobtrusive validation by manually doing it on the client side using the
#Html.TextBoxFor
for my text boxes. For some reason the validation works when attempting to submit with invalid fields (i.e., the text boxes get outlined in red and the appropriate error messages display with the content I put in the
data_val_required
attribute, for example.
However, after I click a button that makes an Ajax request to modify the form with different fields and then submit again, only the red outline on the invalid fields display, but no error messages are rendered.
bjan's trick worked for me, but I still can't see what was causing the issue. All the HTML necessary to carry out the client-side validation was there I just can't figure out why the error message attribute values wouldn't display.
All I can think of is that the jQuery validation code doesn't make a second attempt to check the form fields after a submit was made.
Hi
I am basically calling individual php pages (and their forms) via AJAX in separate JQueryUI tabs. The code is something like:
<div id="dock">
<ul>
<li>Home</li>
<li>Profile</li>
<li>Statistics</li>
<li>Pings</li>
</ul>
</div>
...
jQuery(function($) {
jQuery('#dock').tabs({'collapsible':false});
});
1) Now every time I click on the tabs, their content gets loaded fine but the previous content does not get destroyed. As a result, imagine if a tab was clicked (loaded) N times - a form is also submitted N times. As far as I have understood, multiple bindings occurs here and hence the multiple form submits. How can I prevent this?
2) I have separate forms in each tab. When multiple tabs are selected, multiple forms get loaded. Now if I submit a value (via AJAX) in any one of the form, the data is submitted across all the forms which were previously loaded (Checked with Firebug). How can I prevent this again ?
PS: Enabling caching in tabs partially solved problem #1, but does not help with problem #2.
PPS: I went through quite a few similar posts but I am still stuck :(
Thanks !
From the little bit of code there, it looks like your problems may arise from using the same page (index.php) for each of the tabs. Check these:
Does each form have a separate ID? They should.
Disable caching in both 'cache' and 'ajaxOptions'. This will make sure content is refreshed (and removed) with each click.
How are your forms submitting via AJAX? Regardless of the method, you should handle your form bindings for each tab select through the "load" option.
Try this...
$("#dock").tabs({
load: function (event, ui) {
//setup new content bindings here
},
cache: false,
ajaxOptions: {
cache: false
}
});