Display comments asp mvc - asp.net

I'm working on an mvc .net web application. I hava a database that contains difficulties (a table called difficultes) and each difficulty has comments.
In my view I want to show every difficulty with its corresponding comments and a text area for a new comment and a button to submit it.
I created a model class that contains a difficulty and comments, a string var for the content of a new comment, and a string var for the name of the person who wants to comment. My problem is that I failed to submit the new comment.
Here is my model class
public class difficultecommentaires
{
public difficulte diff { get; set; }
public IList<commentaire> comms { get; set; }
public string pseudo { get; set; }
public string nouveau { get; set; }
}
Here is my action method for submitting the new comment
[HttpPost]
public ActionResult NewComment(int id_diff, string pseudo, string contenu)
{
difficulte d = new difficulte();
using (BDGestionEntities bd = new BDGestionEntities())
{
var query = from j in bd.difficultes where (j.id_diff == id_diff) select j;
foreach (var k in query)
d = k;
}
commentaire com = new commentaire();
com.pseudo = pseudo;
com.difficulte= d;
com.contenu = contenu;
db.AddTocommentaires(com);
db.SaveChanges();
ObtenirDifficulte(id_diff);
return View();
}
And here is my view
#model GestionProjet.Models.difficultecommentaires
#{
ViewBag.Title = "ObtenirDifficulte";
}
<h2>Détails</h2>
<fieldset>
<table>
<tr><td>
<label><b>Titre de la difficulté :</b></label></td><td>#Html.DisplayFor(m=>m.diff.titre)</td></tr>
<tr><td>
<label><b>Description :</b></label></td><td>#Html.DisplayFor(m=>m.diff.description)</td></tr>
</table>
<table>
#foreach (var k in Model.comms)
{
<tr><td>#k.pseudo a dit :</td><td>
#k.contenu</td></tr>
}
</table>
<br />
<table>
<tr><label><b>Nouveau commentaire</b></label></tr>
<tr>
<td><b>Nom :</b></td><td>#Html.TextBoxFor(m=>m.pseudo)</td>
</tr>
<tr>
<td><b>Commentaire :</b></td><td>#Html.TextAreaFor(m=>m.nouveau)</td>
</tr>
</table>
#Html.ActionLink("Ajouter", "NewComment", new { Model.diff.id_diff, Model.pseudo , Model.nouveau})
</fieldset>
<p>
<img src="~/Images/retour.png" alt =""/>
</p>
And here is my model design (the difficulties part)
I think that the problem is in the parameters of my action link. I an error of null value.
How can I solve this.

By the looks of it you're using an ActionLink which will perform a GET (passing the parameters you have given as route parameters, but not the form element values ie. the new comment.) Could try something like below:
#Html.BeginForm("Ajouter", "NewComment", FormMethod.Post, new { id_diff = Model.diff.id_diff })
{
<table>
<tr><label><b>Nouveau commentaire</b></label></tr>
<tr>
<td><b>Nom :</b></td><td>#Html.TextBoxFor(m=>m.pseudo)</td>
</tr>
<tr>
<td><b>Commentaire :</b></td><td>#Html.TextAreaFor(m=>m.nouveau)</td>
</tr>
</table>
<input type="submit" value="Submit" />
}
And have your action accept:
[HttpPost]
public ActionResult NewComment(int id_diff, string pseudo, string contenu)
{

Related

ASP.Net MVC: Css file reference's style is not applying on html when partial view returning as string

I have a small partial view which has a css class reference at. from one of my action i am converting my partial view to string but i noticed css file reference is not working means css style, color nothing is applying on html inside partial view when check the output.
So when i hard code the same css style instead of css file reference in page then it worked.
So my question is if i refer css file in partial view instead of hard code style inside partial view then what i need to do as a result
style should be applied on html when i will check the partial view string ?
The below routine return the string of partial view
public static class StringUtilities
{
public static string RenderViewToString(System.Web.Mvc.ControllerContext context, string viewPath, object model = null, bool partial = false)
{
// first find the ViewEngine for this view
ViewEngineResult viewEngineResult = null;
if (partial)
{
viewEngineResult = ViewEngines.Engines.FindPartialView(context, viewPath);
}
else
{
viewEngineResult = ViewEngines.Engines.FindView(context, viewPath, null);
}
if (viewEngineResult == null)
{
throw new FileNotFoundException("View cannot be found.");
}
// get the view and attach the model to view data
var view = viewEngineResult.View;
context.Controller.ViewData.Model = model;
string result = null;
using (var sw = new StringWriter())
{
var ctx = new ViewContext(context, view, context.Controller.ViewData, context.Controller.TempData, sw);
view.Render(ctx, sw);
result = sw.ToString();
}
return result.Trim();
}
}
this way i am getting string of the partial view
List<Student> studentsVM = new List<Student>
{
new Student {ID=1,FirstName="Joy", LastName="Roy", FavouriteGames="Hocky"},
new Student {ID=2,FirstName="Raja", LastName="Basu", FavouriteGames="Cricket"},
new Student {ID=3,FirstName="Arijit", LastName="Banerjee",FavouriteGames="Foot Ball"},
new Student {ID=4,FirstName="Dibyendu", LastName="Saha", FavouriteGames="Tennis"},
new Student {ID=5,FirstName="Sanjeeb", LastName="Das", FavouriteGames="Hocky"},
};
var viewToString = StringUtilities.RenderViewToString(ControllerContext, "~/Views/Shared/_Report.cshtml", studentsVM, true);
This is my partial view where i refer a css file whose style definition is not getting applied on partial view html.
#model List<TestBOL.Models.Student>
<html>
<head>
<link href="~/Content/Student.css" rel="stylesheet" />
</head>
<body>
<table class="table" id="student">
<thead class="thead-dark">
<tr>
<th>ID</th>
<th>First Name </th>
<th>Last Name </th>
<th>Favourite Game</th>
</tr>
</thead>
#foreach (var d in Model)
{
<tr>
<td>#d.ID</td>
<td>#d.FirstName</td>
<td>#d.LastName</td>
<td>#d.FavouriteGames</td>
</tr>
}
</table>
</body>
</html>
Guide me what to do. thanks

ASP.NET MVC DropDownListFor

My model looks something like this. It gets populated with items at some point by a stored procedure.
public class myModel
{
public List<SelectListItem> myList { get; set; }
public List<myModel> modelList { get; set; }
}
Here is my Controller.
[HttpGet]
public ActionResult getMyListItems()
{
var viewModel = new myModel();
viewModel.myList = viewModel.getMyList();
viewModel.modelList = viewModel.getMyModelList();
return View(viewModel);
}
Here is my view so far. I'm building a dropdownlist so the user can filter the contents of modelList. Kind of like a WHERE clause in an SQL query. Once the user selects the item and clicks the submit button, it applies the filter? Or would this happen after an item is actually selected in the dropdown without the need of a button click event?
#model SWAM2.Models.EmployeeOfcSpecKnow
#using CommonCode.HtmlHelpers;
#using (Html.BeginForm())
{
#Html.AntiForgeryToken()
#Html.ValidationSummary(true)
<div class="editor-label">
Filter by Column1
</div>
<div class="editor-field">
#Html.DropDownListFor(model => Model.Column1, Model.myList, new { style = "width:400px" })
#Html.ValidationMessageFor(model => model.Column1)
</div>
<div class="toppad10">
<input type="submit" value="Apply Filter" />
</div>
<table class="grayTable rowStriping">
<thead>
<tr>
<th>Column1</th>
<th>Column2</th>
<th>Column3</th>
</tr>
</thead>
<tbody>
#foreach (var item in #Model.modelList)
{
<tr>
<td>
#Html.DisplayFor(modelItem => item.Column1)
</td>
<td>
#Html.DisplayFor(modelItem => item.Column2)
</td>
<td>
#Html.DisplayFor(modelItem => item.Column3)
</td>
</tr>
}
</tbody>
</table>
}
You can achieve it by using dropdownlist change event.
refer :
on select change event - Html.DropDownListFor
onchange event for html.dropdownlist
One way to do this is by creating an action on your controller that returns a PartialViewResult and then using AJAX to asynchronously call that action and get the newly filtered list. So for example, you would create an action like this:
public PartialViewResult GetFilteredItems(string filter)
{
var viewModel = new myModel();
viewModel.myList = viewModel.getMyList();
viewModel.modelList = viewModel.getMyModelList();
viewModel.ApplyFilter(filter);
return PartialView(viewModel);
}
and call it using javascript, I prefer jQuery:
$("#dropDownListIdHere").change(function () {
$.ajax({
url: "#Url.Action("GetFilteredItems")",
method: "GET",
data: { filter: $(this).val() },
success: function (result) {
$("#listHolderIdHere").html(result);
}
})
});
Note that with this method, you'd need to create a partial view file (named GetFilteredItems if you don't want to specify a name in the controller action) that would contain the table to be rendered with the filtered items. You would also need to assign an ID to the dropdown and to some sort of container that you'd place your partial view into.

model binding and sumbit button mvc4

I have multiple forms on a cshtml page. The first of these forms binds correctly, but I have not been able to get the second one to bind. Each time I click the submit button the passed values are all 0 or null (int and stings respectively)
My model contains two objects. AccountInfo and a list of AccountSettings:
public class AccountDetailViewRequest
{
public Account AccountInfo { get; set; }
public List<AccountSettings> Settings { get; set; }
}
public class AccountSettings
{
public int AccountID;
public string Name;
public string Value;
public int ID;
}
My actions. The first action that works correctly, but the second does not.
public ActionResult UpdateAccountDetails(Account model)
{...}
public ActionResult DeleteSetting(AccountSettings model)
{...}
In my cshtml page I have this block which works correctly
#using (Html.BeginForm("UpdateAccountDetails", "Account"))
{
<input type = "hidden" name = "AccountInfo.AcctID" value = #Model.AccountInfo.AcctID />
<table>
<tr>
<td>Company #Html.TextBox("AccountInfo.Company")</td>
<--More text boxes here-->
</tr>
<tr>
<td><input name="Save" type="submit" value="Save Changes"/></td>
</tr>
</table>
}
Later in the page I have this block. When I use the associated submit button the function is called, but the parameters are all 0 or null regardless of the content of the text boxes. The boxes populate properly from my DB when I view the source of the code.
#for (int index = 0; index < Model.Settings.Count; index++)
{
var setting = Model.Settings[index];
using (Html.BeginForm("DeleteSetting", "Account"))
{
<tr>
<td>#Html.TextBox("Name", #Model.Settings[index].Name)</td>
<td>#Html.TextBox("Value", setting.Value)</td>
#Html.Hidden("ID", setting.ID)
#Html.Hidden("AccountID", Model.AccountInfo.AcctID)
<td><input type="submit" value="Delete"/></td>
</tr>
}
}
I've tried a number of different variations on the syntax but cannot seem to get it right.
Suggestions, solutions and resources welcome.
Thank you in advance.
Try something like this
<tr>
<td>#Html.TextBox("AccountSettings.Name", #Model.Settings[index].Name)</td>
<td>#Html.TextBox("AccountSettings.Value", setting.Value)</td>
#Html.Hidden("AccountSettings.ID", setting.ID)
#Html.Hidden("AccountSettings.AccountID", Model.AccountInfo.AcctID)
<td><input type="submit" value="Delete"/></td>
</tr>
Your view model is AccountDetailViewRequest of which Name, Value, etc aren't properties.
It'd be tidier if you did something like this:
#foreach (var setting in Model.Settings)
{
using (Html.BeginForm("DeleteSetting", "Account"))
{
<tr>
<td>#Html.TextBoxFor(m => setting.Name)</td>
<td>#Html.TextBoxFor(m => setting.Value)</td>
#Html.HiddenFor(m => setting.ID)
#Html.HiddenFor(m => setting.AcctID)
<td><input type="submit" value="Delete"/></td>
</tr>
}
}
Note that I improvised the above code and you might need to tweak it to work

Not able to update the comment module on the mvc view using ajax call without refreshing the page

This is a check & mate situation for me...
I am using mvc 3.
I am trying to make a post and comment module on a single view. below is the code for the view and controller. I am able to get the post and all the comments on load but once I add a new comment through an AJAX call its is saved to the correct table in DB but I am not understanding how to update it on view without refreshing the page...
//model
public class PostViewModel
{
public bool? IsActive
{ get; set; }
public string PostDescription
{ get; set; }
...
public List<PostCommentModel> objPostCommentInfo { get; set; }
}
//Post Controller
DBEntities1 db = new DBEntities1();
public ActionResult Index(int ID)
{
int id = Convert.ToInt32(ID);
PostViewModel objPostViewModel = new PostViewModel();
List<PostViewModel> lstobjPostViewModel = new List<PostViewModel>();
PostCommentModel objPostCommentModel;
List<PostCommentModel> lstobjPostCommentModel = new List<PostCommentModel>();
var objPost = (from x in db.PostInfoes
where x.PostId == id
select x).ToList();
var objPostComment = (from y in db.PostCommentInfoes
where y.PostId == id
orderby y.CommentId descending
select y).ToList();
foreach (var x in objPost)
{
objPostViewModel.PostID = x.PostId;
objPostViewModel.IsActive = x.IsActive;
objPostViewModel.PostTitle = x.PostTitle;
objPostViewModel.PostDescription = x.PostDescription;
lstobjPostViewModel.Add(objPostViewModel);
}
foreach (var y in objPostComment)
{
objPostCommentModel = new PostCommentModel();
objPostCommentModel.PostId = y.PostId;
objPostCommentModel.IsActive = y.IsActive;
objPostCommentModel.CommentBody = y.CommentBody;
lstobjPostCommentModel.Add(objPostCommentModel);
}
objPostViewModel.objPostCommentInfo = lstobjPostCommentModel;
return View(lstobjPostViewModel);
}
//view
#model IEnumerable<MVCProjectModels.PostViewModel>
<table border="1">
#foreach (var item in Model)
{
<tr>
<td>
<text>Created By:</text>
#Html.DisplayFor(modelItem => item.PostDescription)
</td>
<td rowspan="2">
#Html.DisplayFor(modelItem => item.PostDescription)
</td>
</tr>
.....
}
</table>
<table>
<tr>
<td>
<textarea cols="10" rows="5" id="txtComment"></textarea>
</td>
</tr>
<tr>
<td>
<input id="btnPostComment" type="button" value="Post Comment" />
</td>
</tr>
</table>
<table border="1">
#foreach (var item1 in Model)
{
foreach (var item2 in item1.objPostCommentInfo)
{
<tr>
<td colspan="2">
#Html.DisplayFor(modelItem => item2.CommentBody)
</td>
</tr>
}
}
</table>
//Ajax call to update the comment (The comments gets saves to the database but I am not finding anyway to update it on the UI or View)
<script type="text/javascript">
$("#btnPostComment").click(function () {
var commentBody = $("#txtComment").val();
postComment(commentBody);
});
function postComment(commentBody) {
$.ajax({
url: "/Post/postComment", // this controller method calls a store procedure to insert the new comment in the database.
type: 'POST',
data: {
Comment: commentBody,
ID: 6
},
success: function (result) {
},
error: function () {
alert("error");
}
});
}
</script>
Please let me know if I am doing any major designing mistakes in the above module. I am new to mvc so just trying to do this by reading some books and articles so not sure if this is correct way of achieving such results. thanks
You need to name your table for easier reference:
<table border="1" id="postList">
On your view you are writing a name of a user <text>Created By:</text> but I don't see that in the model. So assuming that is saved in a session or you can retrieve it in your controller you can do something like:
public ActionResult PostComment(YourModel input){
// everything went well
// you get this from a session or from the database
var username = "the creator";
return Json(new { success = true, username});
}
On success of your ajax call:
success: function (result) {
if (result.success) {
$("#postList").append('<tr><td><text>Created By:</text>' +
result.username + '</td><td rowspan="2">' +
commentBody + '</td>');
</tr>
}
}
It will be cool though if instead of concatenating the tr string that you read it from a template and insert the necessary values. Or you can use other tools like knockout to do the binding on the client side. But that is for another question I guess.
You could just .prepend() the new comment text to the comments table in the success callback of your AJAX call:
success: function (result) {
// give your comments table a class="comments" so that the following
// selector is able to match it:
$('table.comments').prepend(
$('<tr/>', {
html: $('<td/>', {
text: commentBody
})
})
);
}

ASP.NET MVC 3 Logic for dynamically generated dropdown controls

I have a form that I generate dynamically, based on the amount of rows in an Excel file that I upload. Where can I add logic that looks through the Description string and sets the dynamically generated dropdownlist to a specified value, based on text in the Description?
I want to add a list of checks, such as:
if "blabla" is in the Description string, set dropdownlist value to 4.
Do I have to do this in Javascript? Cause that doesn't feel that clean to me. I'd prefer my business logic be handled in my Controller, but I'm not sure how that would go in this design.
My code looks like this:
Preview page, which basically just links to my Editor Template named Transaction:
#using (Html.BeginForm("Preview", "Import", FormMethod.Post))
{
<table border="1" style="border-color: #FFFFFF">
#Html.EditorFor(m => m.Transactions, new { Categories = Model.Categories })
</table>
<input id="btnSave" type="submit" value="Opslaan in database" />
}
In this Editor Template transaction, I display some static data, and a textbox and dropdownlist for each row in the Excel that I have previously uploaded in another page:
<tr>
<td style="width: 40px; padding: 5px; background-color: #CurrencyHelper.GetCurrencyColor(Model.Amount)" align="right" nowrap="nowrap">#Html.Raw(CurrencyHelper.GetCurrency(Model.Currency, Model.Amount))
</td>
<td style="white-space: nowrap; padding: 5px;">#Model.DateTime.ToString("dd-MM-yyyy")
</td>
<td style="padding: 5px;">#Model.Description
</td>
<td style="padding: 5px;">#Html.EditorFor(m => m.ShortDescription)
</td>
<td style="padding: 5px;">#Html.DropDownListFor(m => m.CategoryId, new SelectList(ViewData["Categories"] as IEnumerable<Category>, "CategoryId", "Name"))
</td>
</tr>
My controller, which enters the data in the View Model:
//Attach unique Transactions and Categories to ViewModel
var viewModel = new ImportViewModel()
{
Transactions = uniqueTransactions.ToList(),
Categories = categoryRepository.GetCategories().OrderBy(c => c.Name).ToList()
};
Static Binding
public class HomeController : Controller
{
public ActionResult Index()
{
ViewBag.Message = "Welcome to the Training Courses...";
List objcourses = new List();
objcourses.Add("Asp.Net");
objcourses.Add("MVC");
objcourses.Add("WCF");
objcourses.Add("WPF");
objcourses.Add("C#.Net");
ViewBag.Courses = new SelectList(objcourses);
return View();
}
}
#{
ViewBag.Title = "Home Page";
}
Index
#using(#Html.BeginForm(“Index”,”Home”,FormMethod.Get)) {
Courses List; #Html.DropDownList(“Courses“)
}
Dynamic Binding
public class HomeController : Controller
{
public ActionResult Index()
{
private MovieDBContext db = new MovieDBContext();
var GenreLst = new List();
var GenreQry = from d in db.Movies
orderby d.Genre
select d.Genre;
GenreLst.AddRange(GenreQry.Distinct());
ViewBag.Courses = new SelectList(GenreLst);
return View();
}
}
#{
ViewBag.Title = "Home Page";
}
Index
#using(#Html.BeginForm("Index","Home",FormMethod.Get)) {
Courses List; #Html.DropDownList("Courses")
}

Resources