Hello!
I would like to upload a file to the server and also write some data into SQL database after the user fills a form with those metadata. I used the widget this way:
@Html.Kendo().Upload().Name("docUpload").Async(a => a.Save("UploadFile", "Dokumentum", new { id = Model.Id }).AutoUpload(false)).Multiple(true).Events(ev => ev.Upload("onUpload").Error("onError").Success("onSuccess"))
The widget first calls onUpload javascript that calls the action that stores the metadata in SQL (input parameter is json). This action returns empty content if successful, or content with the error message if fails.
Either the first action was successful or failed, the widget calls the UploadFile action, that stores the file on the server (input parameter is HttpPostedFileBase). This action also returns with an empty content if it was successful.
This is works perfectly. My problem is, that what if the metadata writing fails (because of some validation or anything) and the file will be copied to the server. Or the metadata writing is successful but the file store fails. I would like the widget returns successful message only if both are successful or error message if one of them fails (of course the other action shouldn't be executed).
Here's the onUpload javascript:
function
onUpload(e){
var
json=
new
Object();
json[
"json"
]=JSON.stringify({...blah-blah});
$.ajax({
url: '@Url.Action(
"Save,"
Controller"),
async:
false
,
type:
"POST"
,
data:json,
dataType:
'json'
,
success:
function
(result){},
error:
function
(error){}
});
}
Thanks for your help
Hello,
In my mobile application there is an Editor who value i want to submit on save button click. But when i post form serialize the Controller gets no value for Editor in formcollection
@(Html.Kendo().MobileView()
.Name("Notizen")
.Stretch(true)
.Layout("mobile-tabstrip")
.Title("Notizen")
.Content(@<text>
<form class="frmAdressNotes" action="@Url.Action("SubmitMobileNotes", "AdressDetail")" id="frmAdressNotes" method="post">
@(Html.Kendo().Editor().Value(Model.Notes)
.HtmlAttributes(new { style = "width: 480px;height:350px"})
.Name("editor").Encode(true)
)
</form>
</text>)
)
@Html.Hidden("txtTheme1", Session["theme"].ToString())
@(Html.Kendo().MobileLayout()
.Name("mobile-tabstrip")
.Header(obj => NavBarTemplate(this))
)
@helper NavBarTemplate(WebViewPage page)
{
@(Html.Kendo().MobileNavBar()
.Content(navbar =>
@<text>
@(Html.Kendo().MobileButton()
.Align(MobileButtonAlign.Right)
.HtmlAttributes(new { @class = "save"})
.Events(events => events.Click("onClick"))
.Text(""))
</text>)
)
}
function onClick(e) {
var $form = $("#frmAdressNotes");
$form.find("[data-role=editor]").each(function () {
var editor = $(this).data("kendoEditor");
// ... append a hidden input that holds the editor value
$("<input type='hidden' />")
.attr("name", editor.element.attr("id"))
.val(editor.value())
.appendTo(form);
});
var dataPost = $form.serialize();
$.ajax({
url: "@Url.Action("SubmitMobileNotes", "AdressDetail")",
type: 'POST',
strNotes: dataPost,
cache: false,
aysnc:false,
success: function (data) {
if (data == "Error") {
alert(data);
} else {
window.location.href = data;
}
}
});
}
if i write the code in form submit Event it Posts correctly. But i Need a Ajax call .Here is my Controller method
public void SubmitMobileNotes(ControlsContext notemodel, FormCollection formCollection)
{
string keyvalue = formCollection["editor"];
keyvalue is always null
Thanks
Anamika
Hi,
Can you please a documen or sample code, How to hide a loading icon in Grid.
Regards
Suman G
Hello ,
i have a mobile application which embeds a grid with scrollable Feature. Works fine in all android Browsers. But on iPhone the vertical scroll do not work. What could be causing this . I have set height as well.
@(Html.Kendo().MobileView()
.Name("Adressaktivitäten")
.Stretch(true)
.Layout("mobile-tabstrip")
.Title("Adressaktivitäten")
.Content(@<text>
<div >
<table style="width:100%;">
<tr><td>
@if (Model.AdressImgURL != "")
{
<img src="@Url.Action("GetAdressImage", "AdressDetail", new { strFilePath = Model.AdressImgURL })" alt="" style="height:100px;width:80px;" >
}
else
{
<img src="~/Images/vendor_big.png" alt="" style="height:80px;width:80px;" >
}
</td>
<td ><span style="white-space: pre-line;font-weight:bold;">
@Model.Title
</span>
</td>
<td class='alnright'> <a data-role="button" data-icon="search" style="font-size:16px;vertical-align:middle;border-radius: 0px;border:none;outline: 0;" href="@Url.Action("Index", "Adress")"></a>
</td>
</tr>
<tr></tr>
<tr></tr>
</table>
<div>
@(Html.Kendo().Grid(Model.AdrAktGrid)
.Name("Grid_Activity")
.DataSource(dataSource => dataSource
.Ajax()
.Read(read => read.Action("ObjectActivity_Read", "AdressActivity"))
.ServerOperation(false)
)
.Columns(columns =>
{
if (ViewBag.ObjListHeader != null)
{
for (int j = 0; j < ViewBag.ObjListHeader.GetLength(0); j++)
{
if (ViewBag.ObjListHeader[j, 0] == "ID")
{
columns.Bound(ViewBag.ObjListHeader[j, 0]).Title(ViewBag.ObjListHeader[j, 0]).Visible(false);
}
else
{
if (ViewBag.ObjListHeader[j, 0] != null)
{
if (ViewBag.ObjListHeader[j, 1] == "False")
{
columns.Bound(ViewBag.ObjListHeader[j, 0]).Title(ViewBag.ObjListHeader[j, 0]).Visible(false);
}
else
{
columns.Bound(ViewBag.ObjListHeader[j, 0]).Title(ViewBag.ObjListHeader[j, 0]).Width(120);
}
}
}
}
}
})
.HtmlAttributes(new { style = "height: 300px;" })
.Selectable(selectable => selectable
.Mode(GridSelectionMode.Single))
.Scrollable()
.Resizable(r => r.Columns(true))
)
</div>
</div>
</text>)
)
In older iphone browser it works fine though.
Thanks
Anamika
Hi
May last question of the year. I promise! I really don't ask for help much for a long time user.
For my MVC scheduler edit popup I use a CustomEditorTemplate.cshtml because I added 2 extra fields. Nice!
In that file I use the code below for my OwnerID dropdownlist which usually has 8 items.
However, I oftem limit the dropdownlist to only one item when I know the user is filtered to one OwnerID.
So I want the dropdown list to only have that one OwnerID in it automatically selected. But... for some reason a blank row is at the top of the DDL so the user has to manually select the only one item. I don't use .OptionLabel("xxx"). How can I get rid of the empty row at the top and make this work?
I can't switch to another ddl control because I need .Data("filterdata") to pass parameters to.
Thanks
<
div
data-container-for
=
"OwnerID"
class
=
"k-edit-field"
>
@(Html.Kendo().DropDownListFor(model => model.OwnerID)
.HtmlAttributes(new { data_bind = "value:OwnerID", style = "width: 300px" })
.DataTextField("Text")
.DataValueField("Value")
.ValuePrimitive(true)
.Template("<
span
class
=
'k-scheduler-mark'
style
=
'background-color:\\#= data.Color?Color:'
' \\#'></
span
>\\#=Text\\#")
.DataSource(ds => ds
.Read(read => read
.Action("GetDepartmentListx", "Scheduler")
.Data("filterdata") // in index page this function passes checkbox data parameters
))
)
</
div
>
Hi,
In kendo grid view, on databound locked and lockable is not looking good and layout problem. Here sample code
http://dojo.telerik.com/@Suman%20G/OdUCiP
Is there any alternative events available?.
Regards
Suman G
@(Html.Kendo().AutoComplete()
.Name(
"ExternalId"
)
.Placeholder(
"Search..."
)
.MinLength(3)
.DataSource(source => source.Read(read => read.Action(
"SourcesForAutoComplete"
,
"Source"
)
.Data(
"onAdditionalData"
))
.ServerFiltering(
true
))
.HtmlAttributes(
new
{ style =
"width:468px"
}))
<script>
function
onAdditionalData() {
return
{ filter: $(
"#ExternalId"
).val() };
}
</script>
public
JsonResult SourcesForAutoComplete(
string
filter)
{
using
(var db =
new
EasyTaskIntegrationEntities())
{
...
return
Json(result, JsonRequestBehavior.AllowGet);
}
}
I'm evaluating the Kendo for Asp.Net controls and am currently looking at the Grid. I want to build an new/edit form for a Person model. A person can have 0 or more phone numbers. The user should be able to enter the person's first name, last name, multiple phone numbers, and then at the bottom of the form, click a save button to save the person and their phone numbers to the database all at once in a transaction.
For phone number entry, I want to allow the user to click a "New" button that, when clicked, opens a modal dialog containing the form to create a new phone number (e.g. a drop down list for the phone type and a textbox for the phone number.) After filling out the form, they click "Ok" and it displays this unsaved phone number in a table. The phone number's row has an edit and delete button. If I click the edit button, it opens the modal and displays the phone number again as I entered it to allow me to edit it. If I click the delete button, it asks for confirmation from the user and if they provide it, it removes the phone number. Again this is all happening client-side.
Looking at the Kendo Grid, the Popup mode is the right idea as far as the user experience for data entry, but it appears that it is requried to save to make a server call to save to the database upon closing the modal? Since the person that the phone number is a child of does not exist, this won't work, not to mention I want to save in a single transaction. But if there's a way to allow the popup to close and save changes on the client-side only, that's all I need. The Grid's batch editing mode looks like the editing occurs client-side so it may allow me to submit my person and the phone numbers to save in a single transaction, but it uses inline editing, which we do not like for our user experience.
Is it going to be possible to modify the client-side behavior to allow editing Grid rows in a modal dialog so they can be sumitted (and bound to their model) all at once? If so, what would it take to accomplish? I understand the Grid's edit modes can't be mixed, but I'm not sure that means I can't wire up my own javascript that works with my own modal form and the client-side Grid API if necessary.
The Kendo DropDownList seems to take forever to load css. The values are loaded immediately although what is in the dropdown is the value not the text. The page is creating numerous dropdowns. It depends on the call but approximately 300. It works flawlessly with the mvc DropDownListFor. The Kendo call uses this:
@(Html.Kendo().DropDownList().Name("Reason" + person.Id.ToString()).DataTextField("Text").DataValueField("Value").BindTo(@Model.Reasons).Value(@person.ReasonId.ToString()))
All I have to do for the mvc drop down is the following:
@Html.DropDownListFor(m => person.Reason, Model.Reasons)
Should I do something different in the bind?