Develop Reference

How to pass radio button value as route parameter in Laravel?

I want to pass the selected radio button value as a parameter with Laravel route.
My Route is:
Route::resource('/datas','DataController');
From this route, I am aiming to call localhost:8000/datas/{data}
My data.blade.php is:
<form id="dataform" action="{{ route('datas.show')}}" method="GET">
<table class="table">
<tr>
<th>Select bullet</th>
<th>SL NO</th>
<th>Name</th>
<th>Age</th>
</tr>
#foreach ($datas $key => $data)
<tr>
<td><input type="radio" id="data{{$data->id}}" name="data" value={{$data->id}}></option></td>
<td>{{$key}}</td>
<td>{{$data->name}}</td>
<td>{{$data->age}}</td>
</tr>
#endforeach
</table>
<button type="submit" id="edit_submit" class="btn btn-default">Show</button> </form>
My show function will be...
public function show($id)
{
//Code to showing data and redirect to show page
}
I want to get value of this radio button(given below).
<td><input type="radio" id="data{{$data->id}}" name="data" value={{$data->id}}>
and include it as a parameter with the Form action below
<form id="dataform" action="{{ route('datas.show')}}" method="GET">

I have made some changes to this code.
Changed button to anchor tag.
So my blade.php is:-
<table class="table">
<tr>
<th>Select bullet</th>
<th>SL NO</th>
<th>Name</th>
<th>Age</th>
</tr>
#foreach ($datas $key => $data)
<tr>
<td><input type="radio" id="data{{$data->id}}" name="data" value={{$data->id}}></option></td>
<td>{{$key}}</td>
<td>{{$data->name}}</td>
<td>{{$data->age}}</td>
</tr>
#endforeach
</table>
Show
and I added a javascript function too.
<script>
function showfunction(){
var id = document.querySelector('input[name = "data"]:checked').value;
var url = '{{route("admin.questions.show",":id")}}';
url=url.replace(':id',id);
document.location.href=url;
}
</script>

You can't accomplish that with just HTML/Blade. You need javascript (or a javascript framework) for the live changes to work since the parameter in your form's action route depends on the value of the selected radio.
action="{{ route('datas.show', [ 'id' => [insert id here] ])}}"

After creating an array of anchors using netui repeater how do I call a method which will take the anchor id and execute a query

Initially I load the result of a query(select * from table_name) in a pageflow variable a. The query returns an array, now for each object returned in the array I added anchors using netui-data repeater. I kept an anchor to delete the object from the database, however I don't know how I can do so.
Here's the form of the jsp which has the code
<netui:form action="load_answer_main">
<netui:anchor action="add_bot" value="Add Bot"/>
<table id="t4" class="example table-autosort table-autofilter table-autopage:20000 table-page-number:t4page table-page-count:t4pages table-filtered-rowcount:t4filtercount table-rowcount:t4allcount">
<tr><td>Answer Bot Name</td> <td>Utterances</td> <td>Type</td> <td>Action</td>
</tr>
<netui-data:repeater dataSource="pageFlow.a">
<netui-data:repeaterItem>
<tbody>
<tr>
<td style="font-weight:bold;font-size:16px;"> <netui:label value="${container.item.bot_name}" /> </td>
<td style="font-weight:bold;font-size:16px;"> <netui:label value="${container.item.utterances}" /> </td>
<td style="font-weight:bold;font-size:16px;"> <netui:label value="${container.item.bot_type}" /> </td>
<td> <netui:anchor value="Delete Bot" action="delete_bot" tagId="${container.item.id}"/></td>
</tr>
</netui-data:repeaterItem>
</netui-data:repeater>
</tbody>
</table>
</netui:form>
Here is the controller method I want to call where id should be passed from the jsp.
public Forward delete_bot(AnswerForm form){
//TODO Pass ID in the delete action
try {
ma.deleteAnswerBot(id);
} catch (SQLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
return new Forward("home");
}
I'm using Oracle Workshop for Weblogic as my IDE.
Appreciate any input or advice.

So basically we needed to set a parameter in the jsp say id which can be set to the id which was in the database.
<netui-data:repeater dataSource="pageFlow.ld">
<netui-data:repeaterItem>
<netui:anchor value="${container.item.rd.name}" action="getCharts">
<netui:parameter name="id" value="${container.item.rd.id}"/>
</netui:anchor>
</netui-data:repeaterItem>
</netui-data:repeater>
Then in the controller we can access this parameter in the request.
int request_source = Integer.parseInt(this.getRequest().getParameter("id"));

Maximum call stack size exceeded in AngularJS

I am loading data from SQL table using AngularJS and web API. I made a function that shows values in input texts when a row is selected from HTML table. I got this error when i click on any row on the html table when debug.
The HTML
<td>Code</td>
<td><input type="text" size="10" pattern="^[a-zA-Z0-9]+$" title="Alphnumeric" required autofocus ng-model="selectedMember.Code.Staff_Type_Code">
<input type="text" size="10" hidden ng-model="selectedMember.sys_key" /> </td>
</tr>
<tr>
<td>Latin Description</td>
<td><input type="text" required size="35" ng-model="selectedMember.Latin.L_Desc"></td>
</tr>
<tr>
<td>Local Description</td>
<td><input type="text" required size="35" ng-model="selectedMember.Local.A_Desc"></td>
</tr>
<tbody>
<tr ng-repeat="c in Contracts | filter:selectedMember.Code | filter:selectedMember.Latin | filter:selectedMember.Local ">
<td style="display:none;">{{c.sys_key}}</td>
<td>{{c.Staff_Type_Code}}</td>
<td>{{c.L_Desc}}</td>
<td>{{c.A_Desc}}</td>
<td>{{c.Hours_Day}}</td>
<td>{{c.Days_Week}}</td>
<td>{{c.Type_EndWork}}</td>
<td>{{c.Num_EndWork}}</td>
</tr>
</tbody>
Controller.js
$scope.selectedMember = { Code: "",sys_key:"", Latin:"" , Local:"", Hours_Day :"", Days_Week:"", Num_EndWork:"" }
$scope.showInEdit = function (member)
{
debugger;
$scope.selectedMember = member;
$scope.selectedMember.Code = member;
$scope.selectedMember.Latin = member;
$scope.selectedMember.Local = member;
}
when I comment the last 3 lines, selected row values are not displayed in input texts. or i must cancel the filter. is there is a way to work both both
Any help would be appreciated , thanks in advance

You can sometimes get this if you accidentally import/embed the same JS file twice, worth checking in your resources tab of the inspector . or if you are calling a function which is calling another function and so forth .

Add new columns with specific ng-model to HTML table

So I am trying to add additional columns to a table inside a form. Adding the columns themselves is not that difficult but I don't know how to go about setting their ng-models.
This is my current code:
(HTML)
<button ng-click="add()" type="button">+ column</button>
<table>
<thead id="inputtablehead">
<th class="theadlabel">(in 1.000 EUR)</th>
<th>{{startyear}}</th>
<th class="NBBCodesHeader">NBB Codes</th>
<th>Source</th>
</thead>
<tbody class="input">
<tr>
<td>number of months</td>
<td>
<input ng-model="input{{startyear}}.NumberMonths" type="text" class="{{startyear}}" required>
</td>
<td class="NBBCodes"></td>
</tr>
<tr>
<td>Fixed assets</td>
<td>
<input ng-model="input{{startyear}}.FixedAssets" class="{{startyear}}" type="text" required>
</td>
<td class="NBBCodes">20/28</td>
</tr>
<tr>
<td>Inventory</td>
<td>
<input ng-model="input{{startyear}}.Inventory" class="{{startyear}}" type="text" required>
</td>
<td class="NBBCodes">3</td>
</tr>
</table>
(JS)
angular.module("inputFields", []).controller("MyTable", function ($scope) {
$scope.startyear = new Date().getFullYear();
var nextyear = new Date().getFullYear() - 1;
$scope.add = function () {
$(".NBBCodesHeader").before("<th>"+nextyear+"</th>");
$(".input .NBBCodes").before('<td><input class='+nextyear+' type="text" required></td>');
nextyear--;
};
});
So in my JS the <input class='+nextyear+' type="text" required> should become something like <input ng-model="input'+nextyear+'.NumberMonths" class='+nextyear+' type="text" required> for the <td> element added next to the 'number of months' row.
I was thinking to give ea row an id in the form of NumberMonths and then look up the id when adding the column.
So my question would be: is this a valid way to do it and how would I get this id? Or am I overthinking it and is there an easier way to do this?

Use standard javascript [] object notation for variable property names.
<input ng-model="input[startyear].Inventory"

You shouldn't do DOM manipulations from a controller. It's not a good practice when working with AngularJS. A good rule to remember that is: don't use jQuery. It's a common mistake when starting working with AngularJS. And, in case you would be completely sure that you need to modify the DOM, do it always from a directive.
About your problem, maybe you can base your solution in create a data structure in your controller (a Javascript Object), and render it through a ng-repeat in your template. This way, if you modify the object (adding a new column), the template will be automatically updated.

How can i fill the other form fields automatically if user fill one field in jsp (while using spring mvc and hibernate)

I am using spring mvc and Hibernate. I have two entities "project" and employee and their is bidirectional one to many mapping between both. I am able to add existing employees in database to project. But i want now that when the user fills the form fields of employees in jsp, it automatically shows name of all the employees in drop down and when an employee is selected its other fields are automatically set. How can i do that.
I'm novice in spring mvc and jquery.
my jsp to add employees to project
addEmployee.jsp
<form:form modelAttribute="employeeAttribute" method="POST" action="${Url}">
<table>
<tr>
<td>ProjectId:</td>
<td><input type="text" value="${projectId}" />
</tr>
<tr>
<td><form:label path="employeeId"></form:label></td>
<td><form:input path="employeeId" type="hidden"/></td>
</tr>
<tr>
<td><form:label path="employeeName">Employee Name:</form:label></td>
<td><form:input path="employeeName"/></td>
</tr>
<tr>
<td><form:label path="designation">designation:</form:label></td>
<td><form:input path="designation"/></td>
</tr>
<tr>
<td><form:label path="department">department:</form:label></td>
<td><form:input path="department"/></td>
</tr>
<tr>
<td><form:label path="password">password:</form:label></td>
<td><form:input path="password"/></td>
</tr>
<tr>
</table>
<input type="submit" value="Save" />
</form:form>
corresponding action in controller after form is filled
#RequestMapping(value="/add",method = RequestMethod.GET)
public String getAdd(#RequestParam("id")Integer projectId,Model model){
Employee emp = new Employee();
model.addAttribute("projectId",projectId);
model.addAttribute("employeeAttribute",emp);
return "addEmployee";
}
#RequestMapping(value="/add", method = RequestMethod.POST)
public String postAdd(#RequestParam("id")Integer projectId,#ModelAttribute("employeeAttribute")Employee employee) throws IOException{
Employee emp = employeeService.getEmployeeByName(employee.getEmployeeName());
if(emp==null){
return "Error";
}
else{
employeeService.add(projectId,emp);
return "redirect:/project3/list";
}
}

You can write the event for onChange() using javascript for the select box that contains the user list .Using ajax you can send the userid to your controller
So that you fetch the attributes associated with the user and put them in the request . On success of your ajax populate the fields with the appropriate values that are fetched from database.
some good startup examples here and here.
Learn more about jquery-ajax