We Keep Coding

In an MVC Data List what is the best way to toggle conditions in a SQL Query

Please excuse me, I am new to MVC and Entity Framework but have been unable find information to solve my problem.
Problem 1 is that I am trying add a where statement to my model and show only active players. You can see my two separate procedures in my controller, but they both yield the same results.
public IActionResult ActivePlayers()
{
var model = _playerRepository.GetAllPlayers();
return View("Players",model.Where(d => d.IsActive = true));
}
public IActionResult AllPlayers()
{
var model = _playerRepository.GetAllPlayers();
return View("Players", model);
}
My second problem is I am having a hard time figuring how to toggle between All Players and Active ones from the View.
I tried the following, but quickly realized that it wouldn't work since the page is re-rendered after calling the controller. - Note, I was using jQuery to toggle viability.
<div>
<label id="lblShowAll" style="color:green;font-style:italic;font-weight:bold;"
>Showing Active Players</label>
<label id="lblLimitList" style="color:green;font-style:italic;font-weight:bold;display:none;"
>Showing All Players</label>
<br />
<a id="ShowAll" class="btn btn-link"
asp-controller="admin" asp-action="allPlayers">Show All Players</a>
<a id="LimitList" class="btn btn-link" style="display:none;"
asp-controller="admin" asp-action="activePlayers">Limit List (Active Players)</a>
</div>
I'm not sure it matters but this is what my data list looks like in the View.
<div class="container" id="players">
<br />
<div style="width:90%; margin:0 auto;">
<table id="playerList" class="table table-striped table-bordered dt-responsive nowrap"
width="100%" cellspacing="0">
<thead>
<tr>
<th>Name</th>
<th>Address</th>
<th>City</th>
<th>State</th>
<th>Telephone</th>
<th>Edit</th>
<th>Delete</th>
</tr>
</thead>
<tbody>
#foreach (var player in Model)
{
<tr>
<th>#player.Name</th>
<th>#player.Address</th>
<th>#player.City</th>
<th>#player.State</th>
<th>#player.Telephone</th>
<th>
<a class="btn btn-outline-info m-1"
asp-controller="admin" asp-action="editPlayer" asp-route-id="#player.PlayerId">
Edit</a>
</th>
<th>
<a class="btn btn-outline-danger m-1">Delete</a>
</th>
</tr>
}
</tbody>
</table>
</div>
</div>
Thanks in advance!

Set Bootstrap Accordion with specific id

I have got a table shows a number of Errors in each the order. Each row shows how many errors in the specific order. I would like to add a See button at the end of the row and when a user clicks it, that row will expand like an accordion and shows error list.
OrderId Order From Number of Error Button
---------------------------------------------------
1 A 4 See
2 B 3 See
3 C 2 See
When a user click See button on row 2
OrderId Order From Number of Error Button
---------------------------------------------------
1 A 4 See
2 B 3 See
Error 1-
Error 2-
Error 3-
3 C 2 See
I couldn't figure out how to associate/link row with related error
#{int i = 0;}
#foreach (var item in Model.OrderList)
{
i++;
<tr>
<td>
#Html.DisplayFor(ID)
</td>
<td>
#Html.DisplayFor(FROM)
</td>
<td>
#Html.DisplayFor(NumberOfError)
</td>
<td class="text-right">
<a class="btn btn-warning" data-toggle="collapse" href="##i" role="button" aria-expanded="false" aria-
controls="multiCollapseExample:#i">Toggle</a>
</td>
</tr>
<tr class="collapse multi-collapse" id="#i">
<td colspan="3">
Error 1
Error 2
Error 3
</td>
</tr>
enter code here
I know that i need to set anchor href="#" tag to class="collapse multi-collapse" id="", but Bootstrap doesn't like if i start with number like "1abc" or "abc:1". I can't start with number or use ":" inside the id or href.
I tired "abc#{i}" it says i is variable can't use like that
tried this "abc:#i" no error but didn't work, also ":#iabc" or just "#i"

You can show hide the next tr if you are creating tr.
It is simple with jquery to toggle that next tr.
#{int i = 0;}
#foreach (var item in Model.OrderList)
{
i++;
<tr>
<td>
#Html.DisplayFor(ID)
</td>
<td>
#Html.DisplayFor(FROM)
</td>
<td>
#Html.DisplayFor(NumberOfError)
</td>
<td class="text-right">
<button type="button" class="btn btn-primary btn-sm" onclick="changeToggle(this)">See <i class="fa fa-arrow-down" ></i></button>
</td>
</tr>
<tr class="collapse" style="display:none;">
<td colspan="3">
Error 1
Error 2
Error 3
</td>
</tr>
}
<script>
function changeToggle(btn){
$(btn).find(i).removeClass("fa-arrow-up");
$(btn).find(i).removeClass("fa-arrow-down");
if($(btn).closest( "tr" ).next().css('display') == 'none'){
$(btn).find(i).addClass("fa-arrow-down");
$(btn).find(i).removeClass("fa-arrow-up");
}else{
$(btn).find(i).removeClass("fa-arrow-down");
$(btn).find(i).addClass("fa-arrow-up");
}
$(btn).closest( "tr" ).next().toggle();
}
</script>

Master/Detail in ASP.NET MVC with two HTML tables [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 6 years ago.
Improve this question
I am trying to create a master and details view in ASP.NET MVC.
I want to create a view with two tables, such that the first table will load a list of people, and clicking on the select link will load details of the selected person to the second table.
In WebForms, this is easy for me, but with MVC, I don't have any joy.
I have successfully loaded the first, but I am lost with what to do with the second. I have tried to use JavaScript as I did with the cascading dropdownlist, still not working.
#Agramer I am adding some code now, I followed #Shiyju lead and got this far.
<table id="Pat" class="table table-condensed table-hover">
<thead>
<tr>
<th>
Salutation
</th>
<th> Surname</th>
<th> Firstname</th>
<th> Reg. No.</th>
<th></th>
</tr>
</thead>
<tbody>
#foreach (var lst in lstPat)
{
<tr>
<td>
#Html.DisplayFor(modelItem => lst.salutation.Salute)
</td>
<td>
#Html.DisplayFor(modelItem => lst.Surname)
</td>
<td>
#Html.DisplayFor(modelItem => lst.Firstname)
</td>
<td>
#Html.DisplayFor(modelItem => lst.RegNo)
</td>
<th>
<button class="btn btn-xs btn-success" onclick="pickdet(#lst.PatientID)">
#*<span class="glyphicon glyphicon-check"></span>*#
<i class="fa fa-list fa-lg"></i> Select
</button>
<button class="btn btn-xs btn-alert" onclick="location.href ='#Url.Action("Create", "PVSigns1", new { id = lst.PatientID })'">
#*<span class="glyphicon glyphicon-check"></span>*#
<i class="fa fa-list fa-lg"></i> Create New
</button>
<button class="btn btn-xs btn-warning" onclick="location.href='#Url.Action("Edit", "PVSigns1", new { id = lst.PatientID })'">
<span class="fa fa-edit fa-lg"></span> Edit
</button>
</th>
</tr>
}
</tbody>
</table>
<br />
<div>
<h3> Details</h3>
<table id="Pv" class="table table-condensed">
<thead>
<tr>
<td>Sign</td>
<td> Value </td>
</tr>
</thead>
<tbody>
#foreach (var pvv in lstPv)
{
#Html.DisplayFor(modelItem => pvv.VitalSigns.Sign);
#Html.DisplayFor(modelItem => pvv.SignValue);
}
</tbody>
</table>
The JavaScript to attempt filling the table
function pickdet(Id){
var url = "/PVSigns1/GetDetails";
$.post(url, {Id: Id})
.done(function (response) {
$("#Pv").html(response);
});
}
It is actually pulling the results but not putting them into the table result set as seen below.
PVC120HBC150Pulse72

You can use ajax to get the details about the person record which was clicked. Listen to the click event on the anchor tag, get the unique id of the person and make an ajax call to server with this id and let your server returns the details of the person. In your ajax call's success/done event, parse the response coming back and show that as needed.
Something like this
#model IEnumerable<Person>
<table>
<tr><th>Name</th></tr>
#foreach(var p in Model)
{
<tr>
<td>#Html.ActionLink(p.Name,"Details","Person",
new {#id=p.Id},new {class="personLink"})</td>
</tr>
}
</table>
<h2>Details of selected person:</h2>
<div id="fullName"></div>
<div id="jobTitle"></div>
and the javascript to handle the click event is
$(funtion(){
$("a.personLink").click(function(e){
e.preventDefault();
var url=$(this).attr("href");
$.getJSON(url,function(data){
if(data!=null)
{
$("#fullName").text(data.FullName);
$("#jobTitle").text(data.JobTitle);
}
});
});
});
Assuming your Details action method in your PersonController accepts an id(of person) and return an object with FullName and JobTitle property
public ActionResult Details(int id)
{
var d=new {FullName="Shyju", JobTitle="Developer"};
// Hard coded for demo. You may get this information from db
return Json(d,JsonRequestBehaviour.AllowGet);
}
You may also consider returning a partial view result (the html markup you want to render in the details view) instead of returning JSON data. In that case, instead of reading each property value from the response, you may simply set the response(html markup of details) as the inner html of the container div. You may use the jquery html(someString) for that.

optionsText is not applying in my knockout select object

I'm working with in my first knockout experience and have been learning quite a bit. What I'm attempting to do is populate a new object and push it into the viewModel for display.
The select box ( drop down box) is populating but when I click on add, the object name is blank. Then it occurred to me, I have two fields I need to collect from to assemble the object so I'm not sure I'm going about this the right way....
My data model:
function Colors(data) {
this.ID = ko.observable(data.ID);
this.ColorName = ko.observable(data.ColorName);
this.Duration = ko.observable(data.Duration);
}
View:
<table id="NewColor">
<tbody>
<tr>
<td>
<select id="SelectColor" data-bind="options: AllColors, optionsText: 'ColorName', value: AllColorss.ID, optionsCaption: 'Select Color...'"></select>
<input id="Duration" data-bind="value: Duration" />
<button data-bind='click: addColor'>Add Color</button>
</td>
</tr>
</tbody>
The input ID="duration" isn't working / populating right but I'm working on getting the model data to update.... (This is a side issue I'll look at later so of there's syntax issues there, that's why)
The script to add from the button click:
self.addColor = function() { self.AddColors.push(new Color(NewColor )) };
When that runs, the ColorName is blank in the following table but a blank entry is added.
Display / update table:
<table>
<thead>
<tr>
<th padding: 10px; >Color</th>
<th padding: 10px; >Duration</th>
</tr>
</thead>
<tbody data-bind="foreach: AddColors">
<tr>
<td data-bind="text: ColorName"></td>
<td data-bind="text: Duration"></td>
<td>
<a href='#' data-bind='click: $parent.removeLine'>Remove</a>
</td>
</tr>
</tbody>
Is what I'm doing the way to add an object into the array for the newly created object? I don't see a SelectedColor.SelectedText or anything similar. How do I access the text property of the select drop down list?

I'm not sure if what I was doing before would work but I backed off what I had and added in the select box after the line was added which was the same thing the tutorial was doing. That worked. I can't thank you enough, Robert.

This table has a column with check boxs that need to select the row and send rows to another table.

I need to send the coils selected on "AuctionPage" to the another table on "MyBids" Page. I think it would be best to grab the coilID and pass it that way but not sure how? Any help would be appreciated.
AuctionPage-->
#model NucorPrototypes_V1.ViewModel.AuctionPage
#{
ViewBag.Title = "Index";
}
<title>Auction </title>
<div id="header" style="background-color: #008751">
<h1 style="margin-bottom: 0; color: #FFFFFF">Secondary Coil Auction </h1>
</div>
<div id="content">
<h2>Index</h2>
<table id="myTable" border="3" style="background-color: #B0B0B0" cellpadding="10" class="table">
<tr>
<th>Select</th>
<th>Serial Number</th>
<th>Minimum Bid</th>
<th>Current High Bid</th>
<th>Grade</th>
<th>Heat Number</th>
<th>Gauge</th>
<th>Width</th>
<th>Weight</th>
<th>Defect 1</th>
<th>Defect 2</th>
<th>Defect 3</th>
</tr>
#foreach (var item1 in Model.Coils)
{
<tr>
<td>
<input type="checkbox" name="selection" id="#item1.Coil_ID" align="center">
</td>
<td>
#Html.DisplayFor(modelItem => item1.Coil_ID)
</td>
<td>
#foreach (var item2 in Model.Auctions)
{
#Html.DisplayFor(modelItem => item2.Auc_MinBid)
}
</td>
<td>
#foreach (var item3 in Model.Bids)
{
#Html.DisplayFor(modelItem => item3.Bid_Amt)
//string sqlq = "select max(Bid_Amt) from Bid inner join AuctionItem ON Bid.Bid_ID = AuctionItem.Bid_ID where Coil_ID =" + item1.Coil_ID +"' '";
}
</td>
<td>
#Html.DisplayFor(modelItem => item1.Coil_Grade)
</td>
<td>
<a data-toggle="modal" data-target="#myModal">#Html.DisplayFor(modelItem => item1.Coil_HeatNo)</a>
<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title" id="myModalLabel">#Html.DisplayFor(modelItem => item1.Coil_HeatNo)</h4>
</div>
<div class="modal-body">
CHemistries
</div>
</div>
</div>
</div>
</td>
<td>
#Html.DisplayFor(modelItem => item1.Coil_Gauge)
</td>
<td>
#Html.DisplayFor(modelItem => item1.Coil_Width)
</td>
<td>
#Html.DisplayFor(modelItem => item1.Coil_Weight)
</td>
<td>
#Html.DisplayFor(modelItem => item1.Coil_Defect1)
</td>
<td>
#Html.DisplayFor(modelItem => item1.Coil_Defect2)
</td>
<td>
#Html.DisplayFor(modelItem => item1.Coil_Defect3)
</td>
</tr>
}
</table>
</center>
</div>
<center>
Place Bid(s)
</center>
MyBids Page-->
#model NucorPrototypes_V1.ViewModel.MyBids
#{
ViewBag.Title = "MyBids";
}
Auction
Secondary Coil Auction
Bid Amount per 100 weight
Remove Bid
Serial Number
Minimum Bid
Current High Bid
Grade
Heat Number
Gauge
Width
Weight
Defect 1
Defect 2
Defect 3
#foreach( var row in Model.Coils)
{
Remove Bid
#Html.DisplayFor( modelItem => row.Coil_ID)
}
<center>
Confirm Bids
Save as...
</center>

for getting the result of multiple check boxes I use Request.Form
on your controller
Request.Form["chkBoxName"].ToString();
make sure every check box has the same name (chxBoxName in this example) and it will give you a list of all of the check boxes that were selected. You can then add those items to the next table on the controller and redirect there. Hope this helps
Edit:
this will return a comma delimited list of the selected check boxes. since you want to add them to another table you will need to query the database for them.
[HttpPost]
public ActionResult PostBack(){
Model model = new Model();
List<Bids> bids = new List<Bids>();
List<int> result = Request.Form["chkBoxName"].ToString().split(',');
foreach(var id in result){
//query the database to get the record for id
bids.add("result of query");
}
Model.Bids = bids;
return RedirectToAction("Bids", bids);
}

Just put the checkboxes in a sub form where the action goes to the target form. I don't see where the statement is in the HTML you provided, but you can have multiple forms on the same page with differing targets.