create/insert multiple entities simultaneously on one view page - asp.net-mvc

how to implement Create action on Order and Order Details on single Create View?
http://blog.stevensanderson.com/2010/01/28/editing-a-variable-length-list-aspnet-mvc-2-style/
is there any other simpler way to do this? MVC 3 style or in Razor View? thanks so much

Using Razor as your view engine will not make the process simpler, just more readable. And even using ASP.NET MVC 3 you'll have to pretty much end up following the Editing a variable length list post that you mention.
Of course, you can add a new row of fields dynamically completely in jQuery, without having to create an action method for it. Something like:
<div id="fields">
<span class="row">
<input type="text" />
<input type="text" />
</span>
</div>
<a id="add" href="#">Add another</a>
<script type="text/javascript">
$(document).ready(function() {
$("#add").click(function() {
AddTextBox();
});
});
function AddTextBox() {
// clone the last span
var newRow = $("#fields .row:last").clone();
//clear any value the fields might have
$("input", newRow).val("");
//append it to the container div
$("#fields").append(newRow);
}
</script>
Still, the solution in the blog post encapsulates a new row of fields in a partial view which is rather clean.

Related

render umbraco field in partial view

I use umbraco 7 mvc
I simply want to render umbraco field in a partial view. Have no clue how to do it.
#CurrentPage or #Umbraco.Field or RenderMacro etc. do not work
I have the following partial view
#model MvcImport.Models.ImportModel
#{
var formSent = false;
var success = TempData["Success"];
if (success != null)
{
bool.TryParse(success.ToString(), out formSent);
}
}
<script src="#Url.Content("~/Scripts/jquery-1.4.4.min.js")" type="text/javascript"></script>
<script src="#Url.Content("~/Scripts/jquery/jquery.validate.min.js")" type="text/javascript"></script>
<script src="#Url.Content("~/Scripts/jquery/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
#if (formSent)
{
<p>Thanks, we'll get back to you soon!</p>
}
else
{
using (Html.BeginUmbracoForm<MvcImport.Controllers.ImportController>("ImportExcel", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
#Html.AntiForgeryToken()
#Html.ValidationSummary(true)
<div>
#Html.LabelFor(x => x.FileUpload)
#Html.TextBoxFor(x => x.FileUpload, new { type = "file", name = "Files" })
#Html.ValidationMessageFor(x => x.FileUpload)
</div>
<div>
#Html.LabelFor(model => model.FileType)<br />
#Html.DropDownListFor(model => model.FileType, Model.FileTypes)
#Html.ValidationMessageFor(x => x.FileType)
</div>
<input type="submit" value="Submit" class="btn-submit" />
}
}
I simply want to replace
<p>Thanks, we'll get back to you soon!</p>
with current page field eg.
#currentPage.thankYouCopy
or
#Umbraco.Field("thankYouCopy")
How to do it?
I'm calling the partial in my main view by this:
#Html.Partial("Import", new MvcImport.Models.ImportModel { FileTypes = fileTypes })
Thanks
I haven't tested this at all, but this should get you going down the right path... Best I can tell, you want to replace this:
#model MvcImport.Models.ImportModel
With this:
#inherits Umbraco.Web.Mvc.UmbracoViewPage<MvcImport.Models.ImportModel>
This should give you access to the UmbracoHelper and allow you to access the property like so:
#Umbraco.Field("thankYouCopy")
We are a few things mixing up here. You have a custom model while you are trying to get data from Umbraco Nodes.
You are using a custom model to pass to your view. Like #c0r3yz mentions you could change the model being passed to the view. If you have a RenderMvcController or a SurfaceController this might be a good idea.
If you are happy with your current controller (whatever this is), you can use do #Model.MyPropertyName to display the wanted value. If you do not want any umbraco functionality (like the current node etc), this is perfectly fine.
All field retrieval options you mention are similar to each other. What they do is retrieve information of the current Node. Because you are using a custom model, you can not use them until you inherit your custom model from an umbraco baseclass like discussed before.
#Umbraco.Field("myfield") is a helper method which can assist you with getting and formatting the right field. This is probably the easiest solution for starters. One of the very powerfull features is the recursive = true. See the documentation for more information on this.
#CurrentPage.myField return the value of the field (using dynamics). This is easy to write, but might get you in unexpected situations sometimes.
#Umbraco.Content.GetPropertyValue("myField") returns the value of the field. Does exactly the same as the partial but using (and returning) strongly typed methods/objects. If you use Visual Studio, you probably love the intellisense part.
#Umbraco.Content.GetPropertyValue<ACustomType>("myField") returns the value of the field using ValuePropertyConverters. If you use the previous and don't specify the type, propertyconverters will be used too. But with this notation you can control a littlebit more which type is returned.
I've added some links to the documentation so you can look up more information about the different options.

Access a POST value from View

Is there a way to access a POST value from the View (without passing by the controller)
#using (Html.BeginForm()) {
#Html.ValidationSummary(true)
<fieldset>
#Html.TextBox("SomeValue")
<input type="submit" value="Submit" />
</fieldset>
}
The value being posted is #SomeValue
What is the right syntax for #SomeValue
I think the forms collection could be accessed by:
HttpContext.Current.Request.Form
...but why? It defeats the purpose of MVC.
If you need to something client-side, you should be using JavaScript and not put logic in the view. Views should be dumb.
Replacing the line:
#Html.TextBox("SomeValue")
With
#Html.TextBox("SomeValue", new {Id = "somevalue"})
Would allow you to access the value once the view has been rendered with JQuery like so:
$("#somevalue").val()
HTH
If you want to know what is the Value of the TextBox, before it goes to controller, you can get it via javascript.
Change your HTML to have a Span so that we can change the content of it later
The value being posted is
Override your submit behavior and get it
<script type="Text/javascript">
$(function(){
$("form").submit(function(e){
e.preventDefault();
$("#spanVal").html($("#YourTextBoxID").val());
});
});
</script>
This wont really submit the form to the HTTPPOST action method of the controller but shows the value in the textbox inside the span.

ASP MVC standard views

ASP MVC scaffolding creates Index, Create, Update, Delete views, but how practical is that in reality. There seems to be a lot of duplication of UI code with the Create, Update and Delete views. Would it not be more practical to have one view for listing and another for Add/Edit and use some switch to format the view appropriately for Adding or Editing, and allowing deletion off the listing and edit views without redirecting to another view, instead simply popping up some sort of a "Please confirm the delete..." message?
If anyone has done something like this and is willing to share some code snippets or T4 scaffolding templates for generic cases it would be greatly appreciated.
Actually the NuGet package MvcScaffolding does exactly that, using a CreateOrEdit partial view. (See here.) The add/edit views are then created by referencing the partial view (targeting a different controller action respectively):
<fieldset>
#Html.Partial("_CreateOrEdit", Model)
<input type="submit" value="Create" />
</fieldset>
Another alternative would be to use the default MVC scaffold (as defined in the model using data annotations attributes).
<fieldset>
#Html.EditorForModel()
<input type="submit" value="Create" />
</fieldset>
As far as delete, you can always add a second mini-form at the bottom of any view (or in a list):
#{ using (Html.BeginForm("Delete", "MyController", FormMethod.Post))
{
#Html.HiddenFor(model => model.id)
<input type='submit' value='Delete' />
}
}

Removing items from list in form in ASP.NET MVC without using JS

I am trying to implement a form with a list of parameters which can be added and removed by the user. The catch is that I want to do this without javascipt. This is to be done in ASP.NET MVC 3.
I have a form like this (simplified code, so might not be quite right, it is just to illustrate what I have got):
#using (Html.BeginForm("New", "Films", FormMethod.Post, new { id = "NewFilmForm" }))
{
#if (Model.Any())
{
<!-- List of directors that have already been added -->
<div id="AddedDirectors">
#foreach (var director in Model)
{
<span>
#Html.Hidden("AddedDirectors", #director)
#Html.Raw(director)
<!-- JQuery button to remove director -->
<button class="deleteButton" type="button">x</button>
</span>
}
</div>
}
<!-- Interface for adding a new director -->
<div id="AddDirectorInterface">
<!-- Jquery show/hide add single director interface -->
<button type="button" id="AddDirectorButton">+ &nbsp Add a director</button>
<div>
#Html.TextBox("AddDirector")
<!-- Post add button -->
<button name="SubmitButton" value="#Html.Encode(NewFilmActions.AddDirector)">Add</button>
</div>
</div>
<button type="submit" name="SubmitButton" value="#Html.Encode(NewFilmActions.Save)">Save film</button>
}
I have two submit buttons here. Which are handled via a switch statement in the controller and identified via the value attribute which is set based on the NewFilmActions Enum.
Pressing the button with the AddDirector value posts to the controller, adds the name entered in the AddDirector textbox to the model and returns the view with the form again, adding the name specified by the user to the list of directors which have already been added (see commented section).
I would like to add a button allowing me to delete names which have already been added by the user...
I could put in one single button to delete all of them in one go very easily, but if posible I would like to add individual buttons. I can't figure out how to do it though.
One solution I can think off would be to append the name to the value and then in the switch statement have a default and check if the value contains a specified enum value, but that sounds a little like a botched together approach.
Can anybody either tell me how to do this or point me to some tutorial/explanations on how to implement this?
Just to emphasize: I know this can easily be done using JS, but I am looking at doing this entirely serverside for basic functionality and for my personal education.
I think you should reduce the scope of your form so it doesn't include the list.
Then you can put delete forms within you for loop, as shown below;
#foreach (var director in Model)
{
<span>
#Html.Raw(director)
#using (Html.BeginForm("Delete", "Films", FormMethod.Post, new { id = director.Id })){ <button name "DeleteButton" value="Delete">Delete</button>}
</span>
}
An example of this is also shown in this blog

ASP.net MVC 3 Change Image with selected item in dropdownlist

I'm working on my first MVC project. I have very little knowledge on jscript, jquery, ajax..
I need to show the users a page where is a dropdownlist, a image and a create button. The purpose is to a user select a type of object to create. When the user changes the item in the dropdownlist the image has to change without reloading the all page. Then when he hits the create button i have to pass the selected value. I'm using MVC 3 with Razor views.
My question is how do i do this? Code for Action and View. :)
Thanks in advance.
Html
<form action="/myController/myAction">
<select name='imageName' id="imageChooser">
<option value="1">Item id 1<option>
<option value="2">Item id 2<option>
<option value="3">Item id 3<option>
<option value="4">Item id 4<option>
</select>
<!--
name your images on server like 1.jpg,2.jpg
as per ioption value
-->
<<input type="submit" value="create" />
<br />
<div id="imageHolder">
</div>
</form>
Script
jQuery('#imageChooser').bind('change', function () {
var imgeUrl = 'http://yourdomain/' + jQuery('#imageChooser').val() + '.jpg';
jQuery('#imageHolder').html('<img src="'+imgeUrl+'" />');
});
On Server
public ActionResult myAction(string imageName)
{
return View();
}
You must include jQuery in view.
Since you have given no code I will give you an abstract answer.
Use javascript to bind to the dropdown's change event; use the selected item's value/id or whatever as a key to then inject an <IMG /> tag with the correct image in it.
If javascript is disabled, then, it won't work - but at least the user won't always see the same picture.
Since MVC comes with jquery built in - you might as well start reading up on jquery.

Resources