I have search functionality on one of the field once user finished search and selected the value from the data grid i am populating value into field, So I am printing value in console correctly console.log($scope.challengesDTO.chlgOwner) but its not binding it to view model challengesDTO.chlgOwner
main.html
<div class="row">
<div class="form-group col-md-12 fieldHeight">
<label for="chlgOwner" class="col-md-4">Challenge Initiated on behalf of:</label>
<div class="col-md-8">
<input type="text" class="form-control" id="chlgOwner"
ng-model="challengesDTO.chlgOwner" ng-click="openChallengerSearch()"
name="chlgOwner">
</div>
</div>
searchCtrl.js
$scope.selectedChallenger = function(workerObj) {
$scope.challengesDTO.chlgOwner = workerObj.fullName;
$scope.challengesDTO.chlgKey = workerObj.workerKey;
console.log($scope.challengesDTO.chlgOwner);
$scope.viewChallengeWin.close();
};
Related
I have created a dropdown as below:
<div class="col s4">
<label class="control-label flabels">Name</label>
<div class="asteRisk">*</div>
<div class="row d-flex align-items-center">
<div id="FLevelRow" class="row">
<div class="select-wrapper">
<div class="form-group">
<div class="multipleSelection" id="TaskName">
<select required class="dynamic_Time form-control" id="TaskSKAdd">
<option value="">--Select--</option>
</select>
<div class="overSelect"></div>
</div>
</div>
</div>
</div>
</div>
</div>
and I have written below ajax success method in Js file to append ajax response to this dropdown options.
success: function (response) {
console.log("Lookupresponse", response)
for (var application of response) {
var value = application.NAME.toLowerCase();
$('#TaskName .dynamic_Time')
.append(`<option value="${application.id}" name="${value}">${value} </option>`)
}
},
But while running this code, by default some extra html elements and a select option appears before the above appended options and hence it hides appended options with ajax data from the dropdown list as shown in the below image. Because of that, original content are not visible while clicking on the dropdown. There is no error in the console also.
I am building a calculator (php-html) that gets numbers entered by the user. See my snippet below. The output is one query that loop entries from the database (mysql). The text-box options work expectedly it returns the output from the SQL, but when I add the cascade dropdown list to fetch other parameters, the script just gets failing. Looks to me like the "isset" is not able to check the value passed that was selected from the list. How would both dropdown list and text-box options work together? I prefer the GET method to obtain values in both cases.
<form action="" method="GET">
<div class="row">
<div class="col-md-8">
<label for="">Építésű kategória: </label>
<input list="lakas" name="lakas" /></label>
<datalist id="lakas">
<option value="csúszózsalus">
<option value="panel-lakás">
<option value="tégla-építésű">
</datalist>
<?php
if(isset($_GET['lakas'])) {
echo $_GET['lakas'];
}
?>
</div>
<div class="col-md-8">
<label for="">Kerület: </label>
<input type="text" name="stud_id" value="<?php if(isset($_GET['stud_id'])){echo $_GET['stud_id'];}?>"placeholder = "Egy kerület megadása szüséges, pl.: '9'" class="form-control">
</div>
<div class="row">
<div class="col-md-12">
<hr>
<?php
$con = mysqli_connect("localhost","root","","ingatlan");
if(isset($_GET['stud_id']))
{
$stud_id = $_GET['stud_id'];
$stud_id2 = $_GET['stud_id2'];
$stud_id3 = $_GET['stud_id3'];
$lakas = $_GET['lakas'];
I have a page with a list of li elements, each called .section. The page starts with just one section, but the user can add more with a click. Each section has a dropdown called .wip-location and three input fields called .section-number, .section-name, and .section-description. (The -number and -description inputs are irrelevant but I included them here just in case they are causing problems.)
Every time the dropdown is changed, I'd like the selected text to get filled into the .section-name input.
This works the first time (when there is only one .section, .wip-location, and .section-name on the page), but as soon as the user adds more .sections, it appears that Jquery is unable to figure out which element to act upon, and no inputs are filled.
HTML
<li class="section">
<div class="form-group row">
<label class="col-sm-2 text-sm-right">Section Number</label>
<div class="col-sm-7">
<input class="section-number" type="number" step="0.01" min="1" />
</div>
<label class="col-sm-2 text-sm-right">Section Name</label>
<div class="col-sm-7">
<input class="section-name" />
</div>
</div>
<div class="form-group row">
<label class="col-sm-2 text-sm-right">Section Description</label>
<div class="col-sm-7">
<textarea class="section-description" />
</div>
<label class="col-sm-2 text-sm-right">WIP Location</label>
<div class="col-sm-7">
#Html.DropDownListFor(m => m.WipLocation,
new SelectList(Model.WipLocations, "Key", "Value"),
"-- select --",
new { #class = "wip-location" })
</div>
</div>
</li>
jQuery
// Automatically add Wip Location choice to Section Name input
$('.wip-location').change(function () {
var $location = $('option:selected', $(this)).text();
var $section = $(this).closest('.section');
var $sectionName = $section.find('.section-name');
$sectionName.val($location);
});
As I said, when there is only one .section and .wip-location on the page, it works perfectly. I suspect jQuery gets confused when there are multiple .wip-locations or something, but I'm not sure if that's really the problem or how to fix it.
Since it is dynamically added you could try to call the event like this:
$(document).on('change', '.wip-location', function(){/*...*/})
I have a search feature built into a page that hits an API to get a list of items if a user chooses to search instead of manually enter (in an attempt to get some clean data). I have the first column of said table set to call a JavaScript function onclick. That function looks similar to this:
function loadDataFromTable(fname, lname, mname, stn, grade, school) {
$('#StudentFirstName').val(fname);
$('#StudentLastName').val(lname);
if (mname !== "undefined") {
$('#StudentMiddleName').val(mname);
}
else {
$('#StudentMiddleName').val('');
}
$('#StudentNumber').val(stn);
$('#Grade').val(grade);
$('#School').val(school);
return false;
}
The associated HTML elements are all ASP.NET Core Razor View input elements. They look like this:
<div class="form-group">
<label class="col-md-3 control-label">Last Name</label>
<div class="col-md-9">
<input type="text" asp-for="StudentLastName" class="form-control" />
<span asp-validation-for="StudentLastName" class="text-danger"></span>
</div>
</div>
<div class="form-group">
<label class="col-md-3 control-label">STN</label>
<div class="col-md-9">
<input type="text" asp-for="StudentNumber" class="form-control" />
<span asp-validation-for="StudentNumber" class="text-danger"></span>
</div>
</div>
<div class="form-group">
<label class="col-md-3 control-label">Grade</label>
<div class="col-md-9">
<input type="text" asp-for="Grade" class="form-control" />
<span asp-validation-for="Grade" class="text-danger"></span>
</div>
</div>
<div class="form-group">
<label asp-for="School" class="col-md-3 control-label"></label>
<div class="col-md-9">
<select asp-for="School" asp-items="ViewBag.SchoolList" class="form-control"></select>
<span asp-validation-for="School" class="text-danger"></span>
</div>
</div>
Now, if a user clicks on one of the links from the table, all of the values are properly passed into the function, and all of the values for First Name, Last Name, Middle Name, and STN properly update on the view. Grade and School do not update on the View, but their value attribute does update. When I submit the form after the data fills, the correct values are passed to my controller.
What I can't figure out is why the Grade and School values are not populating on the view. The only thing that stands out as different for these two are within the model they are nullable integers, whereas other fields are strings.
I have tried a mixture of .attr('value', grade), .text(grade), and .val(grade), and none of them are working. I can verify that the proper elements are being selected because if I output $('#Grade') I get the input object.
I have a simple HTML form:
<div id="dialog-form-manageadvsertiser" title="Dialog title" style="display: none;">
<div class="col-xs-12">
<div class="form-group">
<label for="inputUserId" class="col-xs-3 control-label">Account number</label>
<div class="col-xs-9">
<input data-val="true" data-val-number="The field must be a number." id="User_Id" name="User_Id" value="" />
</div>
</div>
</div>
<div class="col-xs-12">
<div class="form-group">
<label for="inputAdvName" class="col-xs-3 control-label">Advertiser name</label>
<div class="col-xs-9">
<input data-val="true" data-val-number="" id="AdvName" name="AdvName" value="" />
</div>
</div>
</div>
</div>
I want to set default values for some fields, these values are dynamic, therefore I have a PHP script that returns a json representation of those values:
{
"User_Id": "12345"
}
How can I assign this value to the form's UserID field when it loads?
I'm using jquery framework.
I would expect some kind of mechanism that triggers a POST request to the server when the for loads, and then assigns the values from the response to the form according to the field ID.
I've tried researching it on google but did not find relevant info.
Thanks!
So you want to make ajax call and populate the fields with default value, you will need $.getJSON to make the call
//Function for get the data and assign default value
function getValues() {
//get json from server
$.getJSON( "ajax/test.json", function( data ) {
$.each( data, function( key, val ) {
//Am assuming your input name matches with form fields
$( "input[name='"+ key +"']" ).val(val);
});
});
}
//jQuery document ready
$(function(){
//on page load
getValues();
//This will trigger on change of User_id
$("#User_Id").on('change', getValues);
});
and in PHP, make sure you are returning a valid json with headers
header('Content-type: application/json');
echo json_encode($data_array);
Here is a working Plunk
for more info on $.getJSON see docs