So I'm trying to post back the value that's inside the <td> but for some reason it's not posting it back, all the properties are either null or set to their default value such as 0.
It should post back the values when I click this button
<button type="submit" class="btn btn-icon waves-effect waves-light btn-info"> <i class="fa fa-wrench"></i> </button>
But for some reason it's not grabbing things like <td>#Html.DisplayTextFor(x => x.ServerID)</td> and posting it back
Here is the razor
#using (Html.BeginForm("Edit", "Dashboard"))
{
<table class="table table-hover mb-0">
<thead>
<tr>
<th>#</th>
<th>Server Name</th>
<th>Credentials</th>
<th>Status</th>
<th>Modify</th>
<th>Delete</th>
</tr>
</thead>
<tbody>
<tr>
<td>#Html.DisplayTextFor(x => x.ServerID)</td>
<td>Data</td>
<td>#Html.DisplayTextFor(x => x.Endpoint)</td>
if (Model.IsRunning)
{
<td><span class="badge badge-success">Running</span></td>
}
else
{
<td><span class="badge badge-danger">Stopped</span></td>
}
<td>
<button class="btn btn-icon waves-effect waves-light btn-success"> <i class="fa fa-power-off"></i> </button>
<button class="btn btn-icon waves-effect waves-light btn-danger"> <i class="fa fa-stop"></i> </button>
<button type="submit" class="btn btn-icon waves-effect waves-light btn-info"> <i class="fa fa-wrench"></i> </button>
</td>
<td>
<button class="btn btn-icon waves-effect waves-light btn-danger"> <i class="fa fa-trash"></i> </button>
</td>
</tr>
</tbody>
</table>
}
And the Controller
public ActionResult Edit(ServerModel serverModel)
{
var model = serverModel;
return View();
}
the model properties are null or 0 as I said.
And here is the Model
public class ServerModel
{
public int ServerID { get; set; }
public string Endpoint { get; set; }
public bool IsRunning { get; set; }
}
Try
#Html.HiddenFor(x => x.ServerID)
#Html.DisplayTextFor(x => x.ServerID)
DisplayTextFor will only render the item as text.
Including the hidden field will include them in the payload sent to the server - as form items.
Related
I want to display the name of the value before deleting it.
Have no idea how to data bind in angular.
1.Angular html.
<div *ngIf="pnlItemType" class="col-12">
<table class="table table-bordered table-hover">
<thead class="thead-dark">
<th scope="col">Item Type Name</th>
<th scope="col" colspan="2"></th>
</thead>
<tbody class="bg-white">
<tr *ngFor="let itemType of itemTypes">
<td class="valign-middle">{{itemType.ItemTypeName}}</td>
<td class="w-80 text-center">
<button type="button" class="btn btn-outline-primary"
title="Edit" (click)="editItemType(itemType)"><i class="fas fa-
pen"></i></button>
</td>
<td class="w-80 text-center">
<button type="button" class="btn btn-outline-
secondary" title="Delete" (click)="deleteItemType()"> <i
class="far fa-trash-alt"></i></button>
</td>
</tr>
</tbody>
</table>
/div>
2.Modal view of delete box.
<ng-template #mdlDeleteItemType>
<div class="modal-header">
<h4 class="modal-title"> Confirm to delete this item</h4>
<button type="button" class="close" aria-label="Close" (click) =
"hideModal();">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<span> Are you sure you want to delete this item? </span>
<b>{{itemType?.ItemTypeName}}</b>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-outline-secondary">
Delete</button>
<button type="button" class="btn btn-outline-secondary mg-rt-10"
(click)="hideModal()">Cancel</button>
</div>
</ng-template>
3.codebehind tsfile.
deleteItemType(){
this.hideModal();
this.openLargeModal(this.mdlDeleteItemType);
}
I would like to show the name of the item to be deleted in bold.
deleteItemType(itemType){
this.mdlDeleteItemType = itemType;
this.hideModal();
//Just Open Modal after it
}
And your HTML
(click)="deleteItemType(itemType)"
How would I do to when clicking the checkBox I call the action "ShowActives" of the controller?
This controller returns a list of elements that are active in the database.
How would I return these elements in the table?
my index is my default controller, clicking the checkBox I would like to call the ShowActives Action
public class CodigosDeOperacaoController : BaseController
{
public ActionResult Index()
{
return View(_codigosOperacionaisService.GetAll());
}
public ActionResult ShowActives ()
{
return View(_codigosOperacionaisService.GetActives());
}
}
My View
<div class="row">
<div class="col-md-12">
#using (Html.BeginForm("Index", "CodigosDeOperacao", FormMethod.Get))
{
<div class="row">
<div id="custom-search-input">
<div class="input-group col-md-12">
#Html.TextBox("buscar", null, new { #class = "form-control input", #placeholder = "Pesquisar por nome" })
<span class="input-group-btn">
<button class="btn btn-info btn" type="submit">
<big><i class="fa fa-search-plus"></i></big>
</button>
</span>
</div>
</div>
<div class="col-md-3 text-right">
<input type="checkbox" class="form-check-input" id="exampleCheck1">
<label class="form-check-label" for="exampleCheck1">Mostrar Todos</label>
</div>
<div class="col-md-6 text-right ">
<div>
<button type="button" id="btnNovo" class="btn btn-outline-primary btn-sm" style="min-width: 200px;">Novo código</button>
</div>
</div>
</div>
}
</div>
</div>
<table class="table">
<tr>
<th>
#Html.DisplayNameFor(model => model.Codigo)
</th>
<th>
#Html.DisplayNameFor(model => model.Descricao)
</th>
<th>Ações</th>
</tr>
#foreach (var item in Model)
{
if (!item.Ativo == false)
{
<tr style="background-color:aliceblue">
<td>
#Html.DisplayFor(modelItem => item.Codigo)
</td>
<td>
#Html.DisplayFor(modelItem => item.Descricao)
</td>
<td>
<a href="#Url.Action("Edit", "CodigosDeOperacao", new { id=item.Id })" class="btn btn-warning" style="margin-bottom: 3px" id="tamanho-botoes">
<span class="fa fa-edit"></span>
</a>|
<a href="#" class="btn btn-danger" style="margin-bottom: 3px" id="tamanho-botoes" onclick="iniciarExclusao('#item.Id')">
<span class="fa fa-ban"></span>
</a>
</td>
</table>
}
You can use Url.Action. Something like this should work:
<input type="checkbox" class="form-check-input" id="exampleCheck1"
onclick="location.href='<%: Url.Action("ShowActives", "CodigosDeOperacaoController") %>'" >
I would like to know how I can create a recursive interface, I have a set of menus, these menus are parents having children and so on, since there are not a maximum number of children would like to find a solution to this problem, I left what I have done in ASP.NET MVC code and C #
#foreach (var opcaoPai in opcoesPai)
{
var filhos = opcaoPai.OpcaoMenuFilhosSet.OrderBy(o => o.OrdemMenu);
<div class="list-group-item list-group-item-info" data-parent="##opcaoPai.IdOpcao">
<span>
#if (filhos.Any())
{
<a href="##opcaoPai.IdOpcao" data-toggle="collapse">
<i style="float:left;margin-right:3px;" class="fa fa-caret-down"></i>
#Html.DisplayFor(modelItem => opcaoPai.Titulo)
</a>
}
else
{
#Html.DisplayFor(modelItem => opcaoPai.Titulo)
}
</span>
<!--<td>
#Html.DisplayFor(modelItem => opcaoPai.OrdemMenu)
</td>
<td>
#if (opcaoPai.IdAccao != null)
{
#(opcaoPai.AccaoSet.ControladorSet.PluginSet.Designacao + " - " + opcaoPai.AccaoSet.ControladorSet.Designacao + " - " + opcaoPai.AccaoSet.Designacao)
}
</td>
<td>
#Html.DisplayFor(modelItem => opcaoPai.OpcaoMenuPaiSet.Titulo)
</td>
<td>
#Html.DisplayFor(modelItem => opcaoPai.ConteudoSet.Titulo)
</td>-->
<a href="#Url.Action("Apagar" ,new {id=opcaoPai.IdOpcao})" style="float:right;margin-right:10px;" id="menusgestao" type="btn" class="btn btn-danger btn-xs btnmenus">
<i id="iconsmenugestao" class="fa fa-lock" aria-hidden="true"></i>Eliminar
</a>
<a href="#Url.Action("Detalhes", new {id=opcaoPai.IdOpcao})" style="float:right;margin-right:10px;" id="menusgestao" type="btn" class="btn btn-info btn-xs btnmenus">
<i id="iconsmenugestao" class="fa fa-info-circle" aria-hidden="true"></i>Detalhes
</a>
<a href="#Url.Action("Editar", new {id=opcaoPai.IdOpcao})" style="float:right;margin-right:10px;" id="menusgestao" type="btn" class="btn btn-warning btn-xs btnmenus">
<i id="iconsmenugestao" class="fa fa-pencil" aria-hidden="true"></i>Editar
</a>
</div>
<div id="#opcaoPai.IdOpcao" class="collapse list-group-submenu">
#foreach (var filho in filhos)
{
<div class="list-group-item list-group-item-warning" data-toggle="collapse" data-parent="##opcaoPai.IdOpcao-#filho.IdOpcao">
<span>
#Html.DisplayFor(modelItem => filho.Titulo)
</span>
<!--<td>
#Html.DisplayFor(modelItem => filho.OrdemMenu)
</td>
<td>
#if (filho.IdAccao != null)
{
#(filho.AccaoSet.ControladorSet.PluginSet.Designacao + " - " + filho.AccaoSet.ControladorSet.Designacao + " - " + filho.AccaoSet.Designacao)
}
</td>
<td>
#Html.DisplayFor(modelItem => filho.OpcaoMenuPaiSet.Titulo)
</td>
<td>
#Html.DisplayFor(modelItem => filho.ConteudoSet.Titulo)
</td>-->
<a href="#Url.Action("Apagar" ,new {id=filho.IdOpcao})" style="float:right;margin-right:10px;" id="menusgestao" type="btn" class="btn btn-danger btn-xs btnmenus">
<i id="iconsmenugestao" class="fa fa-lock" aria-hidden="true"></i>Eliminar
</a>
<a href="#Url.Action("Detalhes", new {id=filho.IdOpcao})" style="float:right;margin-right:10px;" id="menusgestao" type="btn" class="btn btn-info btn-xs btnmenus">
<i id="iconsmenugestao" class="fa fa-info-circle" aria-hidden="true"></i>Detalhes
</a>
<a href="#Url.Action("Editar", new {id=filho.IdOpcao})" style="float:right;margin-right:10px;" id="menusgestao" type="btn" class="btn btn-warning btn-xs btnmenus">
<i id="iconsmenugestao" class="fa fa-pencil" aria-hidden="true"></i>Editar
</a>
</div>
}
</div>
}
Suppose you have this structure:
public class Node {
List<Node> Filhos {get;set;}
}
To render recursively, you just need to create an html render helper that receives a Node as parameter:
#helper RenderSomething(Node node) {
// html to display node information
foreach(Node filho in node.Filhos) {
RenderSomething(filho);
}
}
C#/MVC/Knockout
I'm playing around with knockout and I can't seem to get a click handler to work on the name column. However, I can add in an image and assign a click handler to it. It seems to be an issue if the column is being assigned a databind.
This is an example:
<tbody data-bind="foreach: CurrentFeeds" class="table-news-body">
<tr class="panel-danger">
<td id="AllFeeds" data-bind="text: RSSName, click: $parent.showfeed" class="h3"></td>
<td>
<a href="#" data-bind="click: $parent.showFeed"class="btn btn-white btn-sm">
<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
</a>
</td>
#if (bIsEditor)
{
<td>
<button data-bind='click: $.deleteFeed' class="btn btn-primary btn-xs">
<span class="glyphicon glyphicon-trash" aria-hidden="true"></span>
Remove
</button>
</td>
}
</tr>
</tbody>
If I change the allfeeds line to this:
<td id="AllFeeds" data-bind="text: RSSName, click: $parent.showfeed" class="h3"></td>
I don't get an error message but I can't click on that column.
However, if I add in this code:
<td>
<a href="#" data-bind="click: $parent.showFeed"class="btn btn-white btn-sm">
<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
</a>
</td>
I can click on the icon that's created for it.
Whats going on?
I am creating a table of items in a basket, using the following in razor to create an update quantity form in each row, however the first row has all the contents of the using but not the form tag, all subsequent rows work ok (ie. have correct form tags):
#foreach (var item in #Model.SummaryList)
{
<tr id="basket_row_#(item.ProductCode)">
<td>
<img height="25" class="" src="#Html.DisplayFor(modelItem => item.ProdImage)" alt="#Html.DisplayFor(modelItem => item.ProductDesc)">
</td>
<td>
#Html.DisplayFor(modelItem => item.ProductCode)
</td>
<td>
#if (item.ProductCode != "DL")
{
using (Ajax.BeginForm("asyncUpdateCheckoutBasket", "Online", null, new AjaxOptions { UpdateTargetId = "SubTotal_" + item.ProductCode }, new { id = "updFrm_" + item.ProductCode }))
{
<div class="form-group">
<div class="input-group input-group-xs">
#Html.TextBox("newQty", item.Qty, new { id = "newQty_" + item.ProductCode, #class = "form-control", value = item.Qty })
<span class="input-group-btn ">
<button type="submit" value="Update" class="btn btn-success" id="add_btn_#(item.ProductCode)"><span class="glyphicon glyphicon-refresh"></span></button>
</span>
</div>
</div>
<input type="hidden" name="pCode" value="#item.ProductCode" />
}
}
</td>
<td id="SubTotal_#(item.ProductCode)">
#Html.DisplayFor(modelItem => item.SubTotal)
</td>
<td>
<a class="text-primary" title="DELETE: Delete item: #item.ProductCode" href="#(Url.Action("RemoveFromBasket", new { controller = "Online", area = "", pCode = item.ProductCode }))">
<span class="glyphicon glyphicon-trash"></span>
</a>
</td>
</tr>
}
Example of output:
<tr id="basket_row_KF00880">
<td>
<img height="25" title="Q-CONNECT WHITEBOARD MARKER ASTD PK10" alt="Q-CONNECT WHITEBOARD MARKER ASTD PK10" src="https://online.calidore.com/BtoC/Images/KF00880.jpg">
</td>
<td>
KF00880
</td>
<td>
<div class="form-group">
<div class="input-group input-group-xs">
<input name="newQty" class="form-control" id="newQty_KF00880" type="text" value="1">
<span class="input-group-btn ">
<button class="btn btn-success" id="add_btn_KF00880" type="submit" value="Update"><span class="glyphicon glyphicon-refresh"></span></button>
</span>
</div>
</div>
<input name="pCode" type="hidden" value="KF00880">
</td>
<td id="SubTotal_KF00880">
£8.21
</td>
<td>
<a title="DELETE: Delete item: KF00880" class="text-primary" href="/RemoveFromBasket?pCode=KF00880">
<span class="glyphicon glyphicon-trash"></span>
</a>
</td>
</tr>
<tr id="basket_row_KF00255">
<td>
<img height="25" title="Q-CONNECT DVD-R CAKEBOX PK25" alt="Q-CONNECT DVD-R CAKEBOX PK25" src="https://online.calidore.com/BtoC/Images/KF00255.jpg">
</td>
<td>
KF00255
</td>
<td>
<form id="updFrm_KF00255" action="/asyncUpdateCheckoutBasket" method="post" data-ajax-update="#SubTotal_KF00255" data-ajax-mode="replace" data-ajax="true">
<div class="form-group">
<div class="input-group input-group-xs">
<input name="newQty" class="form-control" id="newQty_KF00255" type="text" value="1">
<span class="input-group-btn ">
<button class="btn btn-success" id="add_btn_KF00255" type="submit" value="Update"><span class="glyphicon glyphicon-refresh"></span></button>
</span>
</div>
</div>
<input name="pCode" type="hidden" value="KF00255">
</form>
</td>
<td id="SubTotal_KF00255">17.98</td>
<td>
<a title="DELETE: Delete item: KF00255" class="text-primary" href="/RemoveFromBasket?pCode=KF00255">
<span class="glyphicon glyphicon-trash"></span>
</a>
</td>
</tr>