I have 2 drop down lists in a Partial View and want to display 1st drop down on 1st Search click and 2nd drop down on 2nd Search click in View. The Index contains list of 2 Students Name and each student has Search button.Please guide me how to write code to display drop down based on button click condition. Any help and guidance is highly appreciated.
My Index View:
#model IEnumerable<StudentProject.StudentDetail>
<table class="table">
<tr>
<th>
#Html.DisplayNameFor(model => model.StudentName)
</th>
</tr>
#foreach (var item in Model) {
<tr>
<td>
#Html.DisplayFor(modelItem => item.StudentName)
</td>
<td>
<input type="button" class="btn btn-info" id="btnSearch" value="Search" />
#Html.ActionLink("Details", "Details", new { id=item.StudentId })
</td>
</tr>
}
</table>
<div id="searchResults">
</div>
<script src="~/Scripts/jquery-1.10.2.min.js"></script>
<script type="text/javascript">
var url = '#Url.Action("DisplaySearchResults", "Student")';
$('#btnSearch').click(function () {
debugger;
$('#searchResults').load(url);
})
</script>
My Partial View _StudentLocation:
<!Doctype html>
<html>
<head>
Locations Details
</head>
<body>
<select class="dropdown">
<option>Auckland</option>
<option>Wellington</option>
</select>
<select class="dropdown">
<option>Hamilton</option>
<option>Christchurch</option>
</select>
</body>
</html>
My Controller:
using System.Linq;
using System.Net;
using System.Web.Mvc;
namespace StudentProject.Controllers
{
public class StudentController : Controller
{
private StudentEntities db = new StudentEntities();
// GET: Student
public ActionResult Index()
{
return View(db.StudentDetails.ToList());
}
// GET: Student/Details/5
public ActionResult Details(int? id)
{
if (id == null)
{
return new HttpStatusCodeResult(HttpStatusCode.BadRequest);
}
StudentDetail studentDetail = db.StudentDetails.Find(id);
if (studentDetail == null)
{
return HttpNotFound();
}
return View(studentDetail);
}
public ActionResult DisplaySearchResults()
{
return PartialView("_StudentLocation");
}
}
}
Related
I want to be able to delete selected SQL record.
If the button next to a record is clicked, a pop-up screen saying "Do you really want to delete it?"
And if yes is clicked,
the record FROM SQL next to the button that was clicked is deleted from the table.
I am really stuck in this, even a little help will help.
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>selectToDelete</title>
</head>
<body >
<table border="1">
<tr>
<td>name</td>
<td>id</td>
<td>price</td>
</tr>
<tr>
th:each="i : ${#numbers.sequence(session.sessionInfo.input,session.sessionInfo.input2)}">
<td th:text="${session.session2.goodsList[i].G_name}">
<td th:text="${session.session2.goodsList[i].G_id}">
<td th:text="${session.session2.goodsList[i].G_price}">
<td > <button type="submit" name="deleteParam" th:value="${i}" onclick="DeleteButton1(this.value)">selectButton</button></td>
</tr>
</table>
<script th:inline="javascript">
function DeleteButton1(e) {
if (confirm("Do you want to Delete?")) {
window.open('deleteScreen', '_self' );
}else{
console.log(e)
}
}
</script>
</html>
#Controller
#SessionAttributes(value = { "session2" })
public class DeleteScreen {
#RequestMapping(value = "/deleteScreen", method = RequestMethod.GET)
public String skensaku(Model model, #ModelAttribute("sessionInfo") CondTrainingForm condForm) {
return "selectToDelete";
}
}
REPOSITORY↓
package com.example.repository;
import java.util.List;
import org.seasar.doma.Dao;
import org.seasar.doma.Select;
import org.seasar.doma.boot.ConfigAutowireable;
import com.example.domain.CondTrainingEntity;
import com.example.model.CondTrainingForm;
#ConfigAutowireable
#Dao
public interface DbConnectRepository {
#Select
List<CondTrainingEntity> selectDynamic(CondTrainingForm form);
service↓
#Service
#Transactional
public class DbConnectService {
#Autowired
private DbConnectRepository dbConnectRepository;
public List<CondTrainingEntity> selectUser(CondTrainingForm cond) {
return dbConnectRepository.selectDynamic(cond);
}
SQL file↓
SELECT
G_name, G_id,
G_price
FROM
GOODS
WHERE
G_name LIKE /* #infix(form.G_name) */'G_name'
AND
G_id LIKE /* #infix(form.G_id) */'G_id'
AND
G_price LIKE /* #infix(form.G_price) */'G_price'
I am trying to run an application using AngularJS and Ajax. I also use a Java Controller that returns JSON. Unfortunately, html does not display the table, I cannot understand what is the matter, please help. I am just getting started with Ajax and angularJS. I am trying to output a table in Html, here are my files:
Frames.js
var app = angular.module('frames', []);
app.controller("FramesController", function ($scope, $http) {
$scope.successGetFramesCallback = function (response) {
$scope.frameList = response.data;
$scope.errormessage="";
};
$scope.errorGetFramesCallback = function (error) {
console.log(error);
$scope.errormessage="Unable to get list of frames";
};
$scope.getFrames = function () {
$http.get('/mcga/frames').then($scope.successGetFramesCallback, $scope.errorGetFramesCallback);
};
});
frames.html:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org"
xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity3">
<head>
<meta charset="utf-8"></meta>
<meta http-equiv="X-UA-Compatible" content="IE=edge"></meta>
<title>Schools in our university</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.2/angular.min.js"></script>
<script src="js/frames.js"></script>
</head>
<body ng-app="frames" ng-controller="FramesController">
<h1>Компьютерные корпуса</h1>
<div ng-controller="getFrames" ng-show="frameList.length > 0">
<table id="frameTable">
<thead>
<tr>
<th><h2>Id</h2></th>
<th><h2>Company</h2></th>
<th><h2>Model</h2></th>
<th><h2>Price</h2></th>
<th><h2>Amount</h2></th>
</tr>
</thead>
<tbody>
<tr ng-repeat="frame in frameList" id="{{frame.id}}">
<td>{{frame.id}}</td>
<td>{{frame.company}}</td>
<td>{{frame.model}}</td>
<td>{{frame.price}}</td>
<td>{{frame.amount}}</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>
and my controller is written in java, it gets the list from the Database and returns it in JSON, it works fine. JSON is returned to me. Here is the code:
#RestController
public class MyController {
#Autowired
private Service service;
#GetMapping("mcga/frames")
public ResponseEntity<Object> showAllFrames()
{
List<frame> frameList=service.getAllFrames();
return ResponseEntity.ok(frameList);
}
}
And my ConfigController:
#Configuration
public class ControllerConfig extends WebMvcConfigurerAdapter {
#Override
public void addViewControllers(ViewControllerRegistry registry) {
registry.addViewController("/frames").setViewName("frames");
}
}
You put wrong ng-controller. It must be FramesController: Something like this
<div ng-controller="FramesController" ng-show="frameList.length > 0">
<table id="frameTable">
<thead>
<tr>
<th><h2>Id</h2></th>
<th><h2>Company</h2></th>
<th><h2>Model</h2></th>
<th><h2>Price</h2></th>
<th><h2>Amount</h2></th>
</tr>
</thead>
<tbody>
<tr ng-repeat="frame in frameList" id="{{frame.id}}">
<td>{{frame.id}}</td>
<td>{{frame.company}}</td>
<td>{{frame.model}}</td>
<td>{{frame.price}}</td>
<td>{{frame.amount}}</td>
</tr>
</tbody>
</table>
</div>
So my design is I have multiple display fields and one hidden field. Besides each row there are two buttons accept and reject.my point is when I click a button its value pass to the hidden field and submits automatically in the database.
when I try my code the button doesn't pass anything and I tried all the solutions related to this topic and nothing is working. what am I doing wrong?
controller:
[HttpGet]
public ActionResult Add_Fulfillment ()
{
var getData = db.TBL_Request.Include(x=>x.TBL_Accounts).Include(x=>x.TBL_Accounts_LOBs).ToList() ;
var add_fulfillment = new Add_Fulfillment();
var ful_ = new fulfillmentVM();
foreach (var data in getData)
{
List<Add_Fulfillment> fulfillment = db.TBL_Request.Select(i => new Add_Fulfillment
{
Request_ID = i.Request_ID,
Employee_no = i.Employee_no,
Operation_Date = i.Operation_Date,
Fulfillment_Rate = i.Fulfillment_Rate ??0,
Account_Name = i.TBL_Accounts.Account_Name,
LOB = i.TBL_Accounts_LOBs.LOB,
Status = i.Inserted_by
}).ToList();
ful_._Requests = fulfillment;
}
return View(ful_);
}
[HttpPost]
public ActionResult Add_Fulfillment_Accept(int Request_ID , int? Status)
{
var user= db.TBL_Request.Find(Request_ID);
//hiddenfieldvalue assigns it to the field in the database i want to update
db.SaveChanges();
return RedirectToAction("Add_Fulfillment");
}
[HttpPost]
public ActionResult Add_Fulfillment_Reject(int Request_ID)
{
return RedirectToAction("Add_Fulfillment");
}
the view
#model Staff_Requisition.Models.fulfillmentVM
#{
ViewBag.Title = "Add_Fulfillment";
Layout = "~/Views/Shared/_Layout.cshtml";
}
<h2>Add_Fulfillment</h2>
<!-- page content -->
<div class="right_col" role="main">
<div class="">
<div class="clearfix"></div>
<div class="row">
<div class="col-md-12 col-sm-12 col-xs-12">
<div class="x_panel">
<div class="x_title">
<h2>Plain Page</h2>
<div class="clearfix"></div>
</div>
<div class="x_content">
<table class="table">
<tr>
<th>
Employee_no
</th>
<th>
Operation_Date
</th>
<th>
Fulfillment_Rate
</th>
<th>
Account_Name
</th>
<th>
LOB
</th>
<th></th>
<th></th>
</tr>
#for (int i = 0; i < Model._Requests.Count(); i++)
{
<tr>
<td>
#Html.DisplayFor(x => Model._Requests[i].Employee_no)
</td>
<td>
#Html.DisplayFor(x => Model._Requests[i].Operation_Date)
</td>
<td>
#Html.DisplayFor(x => Model._Requests[i].Fulfillment_Rate)
</td>
<td>
#Html.DisplayFor(x => Model._Requests[i].Account_Name)
</td>
<td>
#Html.DisplayFor(x => Model._Requests[i].LOB)
</td>
<td>
#Html.Hidden("Status" , Model._Requests[i].Status , new { id = "myEdit" })
</td>
#using (Html.BeginForm("Add_Fulfillment_Accept", "TBL_Request", FormMethod.Post, new { #id = "myForm" }))
{
#Html.AntiForgeryToken()
<td>
<button id="btnAccept" class="btn btn-lg btn-success" name="a_button" type="submit" value="122">Accept</button>
#Html.Hidden("Request_ID", Model._Requests[i].Request_ID)
</td>
}
#using (Html.BeginForm("Add_Fulfillment_Reject", "TBL_Request", FormMethod.Post, new { #id = "myForm" }))
{
#Html.AntiForgeryToken()
<td>
<button id="btnReject" class="btn btn-lg btn-danger" name="button" type="submit" value="222">Reject</button>
#Html.Hidden("Request_ID", Model._Requests[i].Request_ID)
</td>
}
</tr>
}
</table>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- /page content -->
#section Scripts {
<script>
$("#btnAccept").click(function () {
$("#myEdit").val($("#btnAccept").val());
})
$("#btnReject").click(function () {
$("#myEdit").val($("#btnReject").val());
})
</script>
}
I solved it. the only issue was I didn't put the hidden field of the status inside the form .that's why it never passes the value. thank you for all your efforts though!
view:
#using (Html.BeginForm("Add_Fulfillment_Accept", "TBL_Request", FormMethod.Post))
{
#Html.AntiForgeryToken()
<td>
<button id="btnAccept" class="btn btn-lg btn-success" name="a_button" type="submit" onclick="accept(122)" value="122">Accept</button>
#Html.Hidden("Request_ID", Model._Requests[i].Request_ID)
#Html.Hidden("Status", Model._Requests[i].Status, new { id = "myEdit", value = "" })
</td>
}
#using (Html.BeginForm("Add_Fulfillment_Reject", "TBL_Request", FormMethod.Post))
{
#Html.AntiForgeryToken()
<td>
<button id="btnReject" class="btn btn-lg btn-danger" name="button" type="submit" onclick="reject(222)" value="222">Reject</button>
#Html.Hidden("Request_ID", Model._Requests[i].Request_ID)
#Html.Hidden("Status", Model._Requests[i].Status, new { id = "myEdit", value = "" })
</td>
}
</tr>
}
</table>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- /page content -->
#section Scripts {
<script>
$('[name = "a_button"]').click(function () {
$('[name = "Status"]').val($('[name = "a_button"]').val());
})
$('[name = "button"]').click(function () {
$('[name = "Status"]').val($('[name = "button"]').val());
})
</script>
I am sending a List to the view.
Trying to submit each item in the list through a form.
Model:
public partial class Model
{
public int Id { get; set; }
public string UId { get; set; }
public int WId { get; set; }
public bool IsEnabled { get; set; }
public virtual AspNetUsers User { get; set; }
public virtual WModel W { get; set; }
}
Controller:
public IActionResult UWC()
{
List<Model> uW = db.UW.Include(x => x.U).Include(x=>x.W).ToList();
return View(uW);
}
[HttpPost]
public IActionResult UWC(Model uW)
{
var s = ModelState.ErrorCount;
return RedirectToAction("UWC");
}
View
#model List<Model>
<table class="table">
<thead>
<tr>
<th>
#Html.DisplayNameFor(model => model[0].W.Name)
</th>
<th>
#Html.DisplayNameFor(model => model[0].W.Type)
</th>
<th>
#Html.DisplayNameFor(model => model[0].W.Description)
</th>
<th>
#Html.DisplayNameFor(model => model[0].W.IsActive)
</th>
</tr>
</thead>
<tbody>
#for (var item = 0; item < Model.Count(); item++)
{
<tr>
<td>
#Html.DisplayFor(model => model[item].W.Name)
</td>
<td>
#Html.DisplayFor(model => model[item].W.Type)
</td>
<td>
#Html.DisplayFor(model => model[item].W.Description)
</td>
<td>
<form asp-action="UserWidgetConfiguration" asp-controller="UserManagement" method="post">
#Html.RadioButtonFor(model => model[item].IsEnabled, true, new { #Name = "IsEnabled",, id = "enabled_" + item } })<label>True</label>
#Html.RadioButtonFor(model => model[item].IsEnabled, false, new { #Name = "IsEnabled" ,, id = "disabled_" + item }})<label>False</label>
<input type="hidden" asp-for="#Model[item].Id" value="#Model[item].Id" name="Id" />
<input type="hidden" asp-for="#Model[item].WidgetId" value="#Model[item].WidgetId" name="WidgetId" />
<input type="hidden" asp-for="#Model[item].UserId" value="#Model[item].UserId" name="UserId" />
</form>
</td>
</tr>
}
</tbody>
</table>
</div>
</div>
</div>
#section Scripts{
<script>
$(function () {
$('input[type=radio]').change(function () {
$(this).closest('form').submit();
});
});
</script>
}
The above is the complete code.
The radio button is always binding to false.
However,
I am using a script to submit the form onchange of radio button value:
<script>
$(function () {
$('input[type=radio]').change(function () {
var data = JSON.stringify($(this).closest('form').serializeArray());
console.log(data);
$(this).closest('form').submit();
});
});
</script>
The console gives the proper value for the radio button.
[{"name":"[0].IsEnabled","value":"True"},{"name":"Id","value":"1"},{"name":"WId","value":"1"},{"name":"UId","value":"a"},{"name":"__RequestVerificationToken","value":"CfDJ8FLfqW1-k2hNlQsGtRBQVqOKRWmlkQYWTMrEQNcJHWGd7_LPvHfjw3V5gxYAnLjwz7HvjExZDXgmbSMQ1DnEONg7EJfu5OqYm7xntqXIe4IMkD1HD4SHRtihdyzDXHrKu7jNXUwuN1B6H-565O0J0oZsGVCopZqy180oPco29vqyvpcZkZnWEOmVQX6_V3T6AQ"}]
When I am expecting a true value for IsEnabled in the controller I am getting a false value.
But the value is true as expected when the form is serialized and displayed in the console.
Is this because of the event handler?
The array prefix in the name of the radio inputs ([0].IsEnabled) causes the inputs not to be mapped in the model, as the name is expected to be IsEnabled.
As simple workaround you could just create the inputs manually without the HTML Helpers, e.g.:
<input type="radio" name="IsEnabled" value="True"/> <label>True</label>
<input type="radio" name="IsEnabled" value="False"/> <label>False</label>
See the source of the helper for additional details.
I have written a simple program for form submit with the data(ArrayList) to send from table to controller class.
While submitting the form the data is always empty not sure what I am doing wrong here.
I am almost spending a lot of time to identify the issue no luck :(
Controller Class ( Where I always getting null in Post method )
public class AccountContoller {
private ArrayList<AccountwithSelection> allAccountwithSelect = new ArrayList<AccountwithSelection>();
public AccountContoller()
{
//Written some test data in Array
AccountwithSelection accountwithSelection1 = new AccountwithSelection();
accountwithSelection1.setAccountnumber("Acct1");
accountwithSelection1.setIlc("ILC1");
allAccountwithSelect.add(accountwithSelection1);
AccountwithSelection accountwithSelection2 = new AccountwithSelection();
accountwithSelection2.setAccountnumber("Acct2");
accountwithSelection1.setIlc("ILC2");
allAccountwithSelect.add(accountwithSelection2);
}
#RequestMapping(value = "/accountload", method = RequestMethod.GET)
String accountload(Model model) {
AccountSelectionListWrapper wrapper = new AccountSelectionListWrapper();
wrapper.setAccountList(allAccountwithSelect);
model.addAttribute("accountload", wrapper);
return "accountload";
}
#RequestMapping(value = "/accountload", method = RequestMethod.POST)
public String addimeiPost(Model model,
#ModelAttribute("accountload") AccountSelectionListWrapper wrapper,
HttpServletRequest request) {
System.out.println(wrapper.getAccountList()); //Always getting null, why ?
return "accountload";
}
}
Class: AccountwithSelection
public class AccountwithSelection {
public String accountnumber, ilc;
public String getAccountnumber() {
return accountnumber;
}
public void setAccountnumber(String accountnumber) {
this.accountnumber = accountnumber;
}
public String getIlc() {
return ilc;
}
public void setIlc(String ilc) {
this.ilc = ilc;
}
}
WrapperClass- AccountSelectionListWrapper
public class AccountSelectionListWrapper {
public ArrayList<AccountwithSelection> accountList;
public ArrayList<AccountwithSelection> getAccountList() {
return accountList;
}
public void setAccountList(ArrayList<AccountwithSelection> accountList) {
this.accountList = accountList;
}
}
HTML Form:(accountload.html)
<form action="#" th:action="accountload" th:object="${accountload}" method="post">
<div class="row">
<div class=form-group-1>
<input type="submit" value="Send Data" name="action">
</div>
</div>
<table id="mytable" class="table">
<tbody class="table-tbody" style="width: 90%">
<tr class="table-head">
<th>ACCOUNT NUMBER</th>
</tr>
<tr class="table-row">
<tr class="table-row" th:each="account, stat : *{accountList}">
<td class="table-data" th:text="${account.getAccountnumber()}"
th:field="*{accountList[__${stat.index}__].accountnumber}"
th:value="${account.getAccountnumber()}"></td>
</tr>
</tbody>
</table>
</form>
<td /> elements aren't submitted with a form. You need to use some kind of input. It should look something like this:
<td class="table-data">
<input type="text" th:field="*{accountList[__${stat.index}__].accountnumber}" />
</td>
or if you want to submit without seeing the fields as editable, something like this
<td class="table-data">
<span th:text="${account.accountnumber}" />
<input type="hidden" th:field="*{accountList[__${stat.index}__].accountnumber}" />
</td>