I want to get text field data based on input given by the user.
Here is my code. This code will fetch data in dropdown(select), but I need to get data in text field.
function getEventname() {
var clid = $('#eventid').val();
console.log("i am ok" + clid);
$.ajax({
type: "GET",
url: "EduManage.jsp",
data: {
control: 'ajax',
ch: '1',
key: '1_0a1m_1',
eventid: clid
},
success: function(data) {
data = data.trim();
addOptions(eventname, data.split(", "), data.split(", "));
}
});
}
<td class="bg1">Event Id
<edu:prnStar/>
<img src="../images/util/final.gif" name="search" width="20" height="20" alt="Search" border="0">
</td>
<td class="bg1" width="25%">
<edu:input name="eventid" type="text" id="eventid" size="10" maxlength="10" onblur="getEventname()" />
</td>
<td class="bg1" width="40%"> Event Name
<edu:prnStar/>
</td>
<td class="bg1" width="25%"><input type="text" name="eventname" id="eventname">
</td>
In the key '1_0a1m_1' am having the query which is fetching the data
SELECT eventname FROM cam_eventdetail WHERE eventid=111
Related
I have inserted a data in mongodb and used nodejs for writting API, need to retrieve those data in front-end using jquery. I have inserted 3 rows of data in mongodb.I have used below code to get data and it is working fine, but it is hardcoded. I want it to happen manually using jquery. Please help to solve this.
$.ajax({
dataType:"json",
url: "/purchaser/purchasersList",
type:"GET",
global:false,
async:false,
success: function(response){
console.log("response is:",response);
document.getElementById("userName").innerHTML = (response[0].userName);
document.getElementById("email_id").innerHTML=(response[0].email_id);
document.getElementById("address").innerHTML=(response[0].address);
document.getElementById("phoneNumber").innerHTML=(response[0].phoneNumber);
//2nd row data
document.getElementById("userName1").innerHTML = (response[1].userName);
document.getElementById("email_id1").innerHTML=(response[1].email_id);
document.getElementById("address1").innerHTML=(response[1].address);
document.getElementById("phoneNumber1").innerHTML=(response[1].phoneNumber);
//3rd row data
document.getElementById("userName2").innerHTML = (response[2].userName);
document.getElementById("email_id2").innerHTML = (response[2].email_id);
document.getElementById("address2").innerHTML = (response[2].address);
document.getElementById("phoneNumber2").innerHTML =(response[2].phoneNumber);
},
error: function (jqXHR, textStatus, errorThrown) { // error callback
console.log("Error Response jqXHR is:" + jqXHR);e
<table class = table2>
<tr>
<th style="text-align:center">SL.No</th>
<th style="text-align:center">Purchaser Name</th>
<th style="text-align:center">Email</th>
<th style="text-align:center">Address</th>
<th style="text-align:center">Phone No</th>
</tr>
<tr>
<td height="50">1</td>
<td height="50" id="userName"></td>
<td height="50" id="email_id"></td>
<td height="50" id="address"></td>
<td height="50" id="phoneNumber"></td>
<td height="50">Active</td>
</tr>
<tr>
..
</tr>
If you can change the id to class then I surges you try something like this:
$.each(response,function(i) {
var tr = $('.table2 tr').eq((i+1));
$(tr).find(".userName").text(response[i].userName)
$(tr).find(".email_id").text(response[i].email_id)
$(tr).find(".address").text(response[i].address)
$(tr).find(".phoneNumber").text(response[i].phoneNumber)
})
Note I can't test it since I dont have your response.
Full code
$.ajax({
dataType: "json",
url: "/purchaser/purchasersList",
type: "GET",
global: false,
async: false,
success: function(response) {
$.each(response,function(i) {
var tr = $('.table2 tr').eq((i+1));
$(tr).find(".userName").text(response[i].userName)
$(tr).find(".email_id").text(response[i].email_id)
$(tr).find(".address").text(response[i].address)
$(tr).find(".phoneNumber").text(response[i].phoneNumber)
})
},
error: function(jqXHR, textStatus, errorThrown) { // error callback
console.log("Error Response jqXHR is:" + jqXHR);
e
<table class=table2>
<tr>
<th style="text-align:center">SL.No</th>
<th style="text-align:center">Purchaser Name</th>
<th style="text-align:center">Email</th>
<th style="text-align:center">Address</th>
<th style="text-align:center">Phone No</th>
</tr>
<tr>
<td height="50">1</td>
<td height="50" class="userName"></td>
<td height="50" class="email_id"></td>
<td height="50" class="address"></td>
<td height="50" class="phoneNumber"></td>
<td height="50">Active</td>
</tr>
<tr>
..
</tr>
I'm new to Laravel and kinda new to JQuery too so bear with me please. So in one of my views I have a form :
<table id="tblAShip" class="report table table-condensed table-hover table-sorter">
<thead class="no-sort">
<tr>
<th>Height</th>
<th>Width</th>
<th>Length</th>
<th>Weight</th>
<th>Create parcel</th>
</tr>
</thead>
<tbody>
<tr>
<td><input id="height" name="height" type="number" /></td>
<td><input id="width" name="width" type="number" /></td>
<td><input id="length" name="length" type="number" /></td>
<td><input id="weight" name="weight" type="number" /></td>
<td><input type="button" name ="creatShip" id="creatShip" value="Ajouter"></td>
</tr>
</tbody>
Then this form is handled by a JS that makes an Ajax call
function creerParcel(){
var docNum = $("#commandeNum").val();
var hei = $("#height").val();
var wid = $("#width").val();
var len = $("#length").val();
var wei = $("#weight").val();
$.ajax({
type: "POST",
url: "/EasyPostNetBanks/Shipment/"+docNum,
contentType: "application/json; charset=utf-8",
processData: false,
data: {
"Parcels":[{
"length": len,
"width": wid,
"height": hei,
"weight": wei }]
},
error: function(jqXHR, textStatus, errorThrown)
{
},
success: function(data){
}
});
then in my controller I try go retreive this data to create a shipment with the parcel information i got from my Ajax call
foreach(\Input::get('Parcels') as $parcelInfo)
{
$parcel = $this->CreateParcel($parcelInfo);
$shipment = Shipment::create(array(
"to_address" => $to,
"reference"=>$idCommande,
"from_address" => $from,
"parcel" => $parcel,
"options" => array("label_format" => "ZPL")
));
$ship = \Shipments::creer($shipment);
$shipments[] = $ship;
}
but my \Input::get('Parcels') is always NULL\n. How is it possible? I've tried almost everything i could find online but to no avail so here I am (first post BTW. Hi all!).
Have you tried viewing the network tab in a browser, to see if everything is being sent up to the server in the way you're expecting? For example, in Chrome open the inspection panel, usually right click and then choose "Inspect Element". Then look in the "Network" tab to see exactly what is being sent to the server.
If the ajax post looks correct, then it will help narrow down exactly where the problem lies. If it's not the front end, try die and dump dd($variable) on the entire post results.
You can do that by using the following somewhere in the controller.
dd(Input::all());
OK, turns out it was my processData: false, that caused the problem, silly me.
i need your experience in casperjs!
I am trying to access a web page (which is not an issue) and to navigate through a html tab.
When i access the page it is by default always showing the first tab "General" but i need to switch to "Options" tab so that i can access one field that i am interested to modify the value!
Sorry, can't post images yet!
Html code:
<b> <b>
<table class="commonfont" cellpadding="0" cellspacing="0" background="/tab_between.png" border="0">
<tbody>
<tr>
<td><input name="" src="/tab_sel_left.png" border="0" type="image"></td>
<td align="center" background="/tab_sel_bg.png">
General
</td>
<td><input name="" src="/tab_sel_right.png" border="0" type="image"></td>
<td width="1"></td>
<td><input name="" src="/tab_unsel_left.png" border="0" type="image"></td>
<td align="center" background="/tab_unsel_bg.png">
Options
</td>
<td><input name="" src="/tab_unsel_right.png" border="0" type="image"></td>
<td width="1"></td>
</tr>
</tbody>
</table>
...
</b></b>
My casper.js file looks like this:
...
casper.then(function() {
test.assertTextExists("DB", "Login into DB 2");
this.click('a#changeThis1_link');
});
casper.then(function() {
test.assertTextExists("Options", "DB Options");
this.click('a#menu1itemUnSel[tabindex="4"]');
});
casper.then(function() {
test.assertTextExists("Change", "DB -Change -Step 1/2");
this.fill('form[name="dbActionForm"]', {
'generalParams.poolSize': '1',
}, false);
this.click('input[name="Apply"]');
});
...
I just can't figure out what should this line look like:
this.click('a#menu1itemUnSel[tabindex="4"]');
since this isn't working!!!
Execution printout:
modifying DB pool size:
Test file: /target.js
# DB modify
PASS DB has the correct title
PASS login form is found
PASS Login into DB
PASS Login into DB 1
PASS Login into DB 2
PASS DB Options
FAIL Cannot dispatch mousedown event on nonexistent selector: a#menu1itemUnSel[tabindex="4"]
# type: uncaughtError
# error: Cannot dispatch mousedown event on nonexistent selector: a#menu1itemUnSel[tabindex="4"]
# CasperError: Cannot dispatch mousedown event on nonexistent selector: a#menu1itemUnSel[tabindex="4"]
# at mouseEvent (/casper.js:1323)
# at click (/casper.js:428)
# at /target.js:34
# at runStep (/casper.js:1523)
# at checkStep (/casper.js:368)
# stack: not provided
Any clue what i am doing wrong and how can i overcome this issue?
Thanks for your time
Some updates and more information:
After Fanch information, I changed the casperjs to:
...
casper.then(function() {
test.assertTextExists("DB", "Login into DB 2");
this.click('a#changeThis1_link');
});
casper.then(function() {
test.assertTextExists("Options", "DB Options");
this.click('a.menu1itemUnSel[tabindex="4"]');
});
casper.then(function() {
test.assertTextExists("Change", "DB -Change -Step 1/2");
this.fill('form[name="dbActionForm"]', {
'generalParams.poolSize': '1',
}, false);
this.click('input[name="Apply"]');
});
...
This a.menu1itemUnSel[tabindex="4"] solved my error about changing the tab but i still have the issue with reading/changing the field generalParams.poolSize.
I even added then waitForSelector/waitForText but still get the error: Errors encountered while filling form: form not found
See casperjs:
...
casper.then(function() {
test.assertTextExists("Options", "DB Options");
this.click('a.menu1itemUnSel[tabindex="4"]');
});
casper.waitForSelector("a#dve_menu_datarepositories", function() {
this.echo("1.Loading form");
});
casper.waitForText("50", function() { //the field that i want to change has text '50'
this.echo("2.Loading form");
});
casper.then(function() {
test.assertTextExists("Change", "DB -Change -Step 1/2");
this.fill('form[name="dbActionForm"]', {
'generalParams.poolSize': '1',
}, false);
this.click('input[name="Apply"]');
});
...
Thanks again
Sorry i was away for a while, here is some html part of the page:
<a name="topofpage">
<form autocomplete="off" enctype="application/x-www-form-urlencoded" action="/db.do" method="post" name="dbActionForm">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td>
<table width="100%" height="100%" border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr height="100%">
<td valign="top" height="100%"></td>
<td valign="top" height="100%" background="/menu3_sel_right1.png"></td>
<td class="commonfont" width="100%" valign="top" background="/menu3_sel_right1.png" align="left">
<b>
<b>
<table class="commonfont" border="0" cellspacing="0" cellpadding="0" onkeypress="return onWizardPageKeyPress(event);">
<tbody>
<tr id="generalParams.poolSize_TR" class="formpagefieldname" style="display:table-row;">
<td>
<a id="generalParams.poolSize_changeA" style="visibility:hidden;" title="Undo Change" onclick="revertSingleChange('generalParams.poolSize', false); dependantsRunOnLoad(document.body); return false;" href="javascript:;"></a>
</td>
<td>
<input type="text" onblur="if (!this.disabled) {onChangeProperty(this, false);} " onpropertychanged="if (!this.disabled) {onChangeProperty(this, false);} " onkeyup="if (!this.disabled) { onChangeProperty(this, false); }" tabindex="2" title="10" size="30" value="50" name="generalParams.poolSize"></input>
</td>
</tr>
</tbody>
</table>
</b>
</b>
I still have the problem filling in the form!
FAIL Errors encountered while filling form: form not found
# type: uncaughtError
# error: Errors encountered while filling form: form not found
Any clue more?
Thanks for your time!!!
Use this :
this.click('a.menu1itemUnSel[tabindex="4"]');
-> # = div, . = class
My HTML is like this
<tbody>
<tr>
<td ><img src="" alt="close" /></td>
<td><input type="hidden" name="addproducts" value="141420">141420</td>
<td class="prd"><strong></strong></td>
<td><a rel="prettyPhoto" href=""><img src="" alt="Product"></a></td>
</tr>
<tr>
<td ><img src="" alt="close" /></td>
<td><input type="hidden" name="addproducts" value="1213143">1213143</td>
<td class="prd"><strong></strong></td>
<td><a rel="prettyPhoto" href=""><img src="" alt="Product"></a></td>
</tr>
<tr>
<td ><img src="" alt="close" /></td>
<td><input type="hidden" name="addproducts" value="242424">242424</td>
<td class="prd"><strong></strong></td>
<td><a rel="prettyPhoto" href=""><img src="" alt="Product"></a></td>
</tr>
</tbody>
I want select all hidden inputs with name addproducts from this and add to an ajax call.
The problem is that I can't predict how many elements will be there before the code execute.
The ajax url i am trying to make will be like this
http://mydomain.com?addproducts=141420&q141420=16&addproducts=X945X2MG&qX945X2MG=1&addproducts=8382355&q8382355=10&addproducts=146353&q146353=3
my usual code for specific parameters in url will be some thing like this
ajaxManager.add(({
type: 'GET', url: '/ajaxhandler', data: { addproducts: X945X2MG,qX945X2MG:1}
but here i can't use this because of unpredictable parameters.
any way i had made some try which ended up in syntax error.code is this
ajaxManager.add(({
$(this).parent().parent().find(".antal").find("input:hidden[name='addproducts']").map(function () {
return
type: 'GET', data: {addproducts:this.value,'&q'+$(this).val():$(this).next().val()}
EDIT:from Alnitak's post i have tried to edit this .
new code
var data = $(this).parent().parent().find(".antal")
.find("input:hidden[name='addproducts']").map(function () {
return
{ addproducts: this.value}
data['q' + $(this).val()] = $(this).next().val();
}).get().join(',')
ajaxManager.add(({
type: 'GET', data: data
but unfortunatedly it ended up my ajax call comes like this
http://mydomain.com?_=1365768440633
I am sure I have made some thing terribly wrong.Cany one help me on this
You should create an object literal with the known keys, and then use obj[key] syntax for the variable keys:
var data = { 'addproducts[]': [] };
$(this).parent().parent().find(".antal")
.find("input:hidden[name='addproducts']")
.each(function () {
data['addproducts[]'].push(this.value);
data['q' + this.value] = $(this).next().val();
});
$.ajax({
...,
data: data
});
Note the use of addproducts[] to allow encoding of an array of values for that particular parameter. Note that there's not actually a defined standard for passing multiple values with the same key for x-www-form-urlencoded data, but this works with PHP. You should consider changing the way your products are added - perhaps a comma-separated list?
I have a question about data binding using knockout.
Here's the problem: I have a table, I what I would like to do is that when a row in table is clicked, I want the values of the row to appear in the input fileds which are located above the table.
so here'
<tbody data-bind="foreach: customers">
<tr data-bind="click: doSomething">
<td data-bind="text: date"></td>
<td data-bind="text:staff"></td>
<td data-bind="text: ftype"></td>
<td data-bind="text: value"></td>
<td data-bind="text: message"></td>
</td>
</tr>
</tbody>
In my viewmodel, I have the following function:
doSomething: function(data) {
var self = this;
self.date(data.date);
self.staff(data.staff);
self.ftype(data.ftype);
self.value(data.value);
self.message(data.message);
}
Here's the error I am getting:
["Unable to parse bindings.↵Message: ReferenceError:… is not defined;↵Bindings value: click: doSomething", "views/myView/index", Object]
0: "Unable to parse bindings.↵Message: ReferenceError: doSomething is not defined;↵Bindings value: click: doSomething"
1: "views/myView/index"
2: Object
length: 3
__proto__: Array[0]
Let me know if I need to provide any more details. I will appreciate your help fplks!
A very basic pattern for this type of thing is to have an array of items and a selectedItem observable that you populate when selecting a row.
Then, you can use the with binding around a section to create your editor.
<table>
<tbody data-bind="foreach: customers">
<tr data-bind="click: $root.selectedCustomer">
<td data-bind="text: name"></td>
</tr>
</tbody>
</table>
<hr/>
<div data-bind="with: selectedCustomer">
<input data-bind="value: name" />
</div>
Sample: http://jsfiddle.net/rniemeyer/Z6VPV/
You need to bind your model to the view
var currentViewModel = function(){
this.doSomething = function(data){
var self = this;
self.date(data.date);
self.staff(data.staff);
self.ftype(data.ftype);
self.value(data.value);
self.message(data.message);
}
var viewModel = new currentViewModel();
ko.applyBindings(viewModel);