Select options disapear when i select item (Angular)

Select options disapear when i select item (Angular) - javascript

I have a strange case. When i select item as select option items in select disappear. This is happening in both selectors.
This is my controller
controllers.addLocationCtrl = function($scope, countriesFactory, provincesFactory){
countriesFactory.getCountries().then(function(data){
$scope.countries = data;
console.log($scope.countries);
});
provincesFactory.getProvinces().then(function(data){
$scope.provinces = data;
console.log($scope.provinces);
});
}
This are objects for countries
[{"id_country":"1","country":"Austria"},
{"id_country":"2","country":"Belgium"},{"id_country":"3","country":"Bulgaria"},{"id_country":"4","country":"Croatia"},{"id_country":"5","country":"Cyprus"},{"id_country":"6","country":"Czech Republic"},
{"id_country":"7","country":"Denmark"},{"id_country":"8","country":"Estonia"},{"id_country":"9","country":"Finland"},{"id_country":"10","country":"France"},{"id_country":"11","country":"Germany"},{"id_country":"12","country":"Greece"}]
And this is my HTML
<div class="form-group">
<label>Country</label>
<select class="form-control" data-ng-model="countries"
data-ng-options="c.id_country as c.country for c in countries"></select>
</div>
<div class="form-group">
<label>Province</label>
<select class="form-control" data-ng-model="provinces"
data-ng-options="p.id_province as p.province for p in provinces">
</select>
</div>
When i select one item in select then this happens
<div class="form-group">
<label>Country</label>
<select class="form-control ng-valid ng-empty ng-dirty ng-valid-parse ng-touched"
data-ng-model="countries" data-ng-options="c.id_country as c.country for c in countries"><option selected="selected"></option></select>
</div>
Console log shows no errors at all. Am i using data-ng-model wrong way? What might be the couse for this problem. If you need any additional information's please let me know. Thank you

When you select an item, AngularJS replaces the content of countries with the id_country that you have selected. So no countries to show in the select tag.
See your issue in this demo:
(function() {
var app = angular.module("app", []);
app.controller("addLocationCtrl", ["$scope",
function($scope) {
$scope.countries = [{
"id_country": "1",
"country": "Austria"
}, {
"id_country": "2",
"country": "Belgium"
}, {
"id_country": "3",
"country": "Bulgaria"
}, {
"id_country": "4",
"country": "Croatia"
}, {
"id_country": "5",
"country": "Cyprus"
}, {
"id_country": "6",
"country": "Czech Republic"
}, {
"id_country": "7",
"country": "Denmark"
}, {
"id_country": "8",
"country": "Estonia"
}, {
"id_country": "9",
"country": "Finland"
}, {
"id_country": "10",
"country": "France"
}, {
"id_country": "11",
"country": "Germany"
}, {
"id_country": "12",
"country": "Greece"
}];
}
]);
})();
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div data-ng-app="app">
<div data-ng-controller="addLocationCtrl">
<div class="form-group">
<label>Country</label>
<select class="form-control" data-ng-model="countries" data-ng-options="c.id_country as c.country for c in countries"></select>{{countries}}
</div>
<div class="form-group">
<label>Province</label>
<select class="form-control" data-ng-model="provinces" data-ng-options="p.id_province as p.province for p in provinces">
</select>
</div>
</div>
</div>
Solution: Replace data-ng-model="countries" by other name.
data-ng-model="currentCountryId" and data-ng-model="currentProvinceId".
(function() {
var app = angular.module("app", []);
app.controller("addLocationCtrl", ["$scope",
function($scope) {
$scope.countries = [{
"id_country": "1",
"country": "Austria"
}, {
"id_country": "2",
"country": "Belgium"
}, {
"id_country": "3",
"country": "Bulgaria"
}, {
"id_country": "4",
"country": "Croatia"
}, {
"id_country": "5",
"country": "Cyprus"
}, {
"id_country": "6",
"country": "Czech Republic"
}, {
"id_country": "7",
"country": "Denmark"
}, {
"id_country": "8",
"country": "Estonia"
}, {
"id_country": "9",
"country": "Finland"
}, {
"id_country": "10",
"country": "France"
}, {
"id_country": "11",
"country": "Germany"
}, {
"id_country": "12",
"country": "Greece"
}];
}
]);
})();
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div data-ng-app="app">
<div data-ng-controller="addLocationCtrl">
<div class="form-group">
<label>Country</label>
<select class="form-control" data-ng-model="currentCountryId" data-ng-options="c.id_country as c.country for c in countries"></select>{{countries}}
</div>
<div class="form-group">
<label>Province</label>
<select class="form-control" data-ng-model="currentProvinceId" data-ng-options="p.id_province as p.province for p in provinces">
</select>
</div>
</div>
</div>

Related

Sorting Data from External JS File Numerically by Price

I am creating a ecommerce website and the data is being pulled from what will be an external JS file containing an array of all of the products.
I currently have a "sort" button and want to sort the books by their price which is a numerical value. Depending on the category that is selected, the books on the page should sort from high to low and low to high when the button is clicked.
I have done this in using SQL but never this way, any help is appreciated!
<div class="grid-x grid-padding-0">
<div class="medium-3 cell">
<div class="SubjectContainer">
<div class="float-left">
<div class="filterTitle" style="padding-left: 5px">Choose a subject</div>
<div class="filterctn">
<div class="optionctn">
<input type="checkbox" name="subject" value="accounting" id="accounting">
<label class="filterlabel" for="accounting">Accounting</label>
</div>
<div class="optionctn">
<input type="checkbox" name="subject" value="agriculture" id="agriculture">
<label class="filterlabel" for="business">Agriculture</label>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="filterTitle">Sort by Price<br>
<small style="padding-top: 10px">(highest to lowest)</small> </div>
<button class="sortBtn" onclick="sorted()">Sort</button>
</div>
Data
<script>
AllSubjects([{
"journalfilter": "accounting",
"journalorder": "1",
"journaltitle": "Accounting I",
"journalprice": "22",
},
{
"journalfilter": "accounting",
"journalorder": "2",
"journaltitle": "Accounting II",
"journalprice": "12",
},
{
"journalfilter": "agriculture",
"journalorder": "3",
"journaltitle": "Agriculture I",
"journalprice": "40",
},
{
"journalfilter": "agriculture",
"journalorder": "4",
"journaltitle": "Agriculture II",
"journalprice": "25",
},
{
"journalfilter": "agriculture",
"journalorder": "5",
"journaltitle": "Agriculture III",
"journalprice": "16",
},
]);
</script>

What about
/* Ascending */
yourArray.sort((a, b) => {
return parseInt(a.journalprice) - parseInt(b.journalprice);
});
/* Descending */
yourArray.sort((a, b) => {
return parseInt(b.journalprice) - parseInt(a.journalprice);
});
I would recommend, that you store the prices as numbers, more specifically integers (so store 1$ as 100), but not as string.

How to get label of an input field when submit a form in Angular JS

What I want to achieve is when I submit the form it should return the label of the option I choose in the console but it is returning me the value of the option.
Expected Result:
DXBA-sky
Result getting:
Dubai
HTML
<div class="suggestField">
<input type='text' list='listid' placeholder="TO" ng-model="toCity" ng- change="suggestCity(toCity)">
<datalist id='listid'>
<option ng-repeat="item in fromSuggestData" label='{{item.PlaceId}}' value='{{item.PlaceName}}'>
</datalist>
<button ng-click="submitForm(toCity)">SUBMIT</button>
</div>
JS
$scope.fromSuggestData = {
"PlaceId": "DXBA-sky",
"PlaceName": "Dubai",
"CountryId": "AE-sky",
"RegionId": "",
"CityId": "DXBA-sky",
"CountryName": "United Arab Emirates"
}, {
"PlaceId": "DUJ-sky",
"PlaceName": "Dubois",
"CountryId": "US-sky",
"RegionId": "PA",
"CityId": "DUJA-sky",
"CountryName": "United States"
}
$scope.submitForm = function(toCity) {
console.log(toCity);
}

Here Is demo using ng-option.
var app = angular.module("myApp", []);
app.controller("myCtrl", function($scope) {
$scope.fromSuggestData = [{
"PlaceId": "DXBA-sky",
"PlaceName": "Dubai",
"CountryId": "AE-sky",
"RegionId": "",
"CityId": "DXBA-sky",
"CountryName": "United Arab Emirates"
}, {
"PlaceId": "DUJ-sky",
"PlaceName": "Dubois",
"CountryId": "US-sky",
"RegionId": "PA",
"CityId": "DUJA-sky",
"CountryName": "United States"
}];
$scope.submitForm = function(toCity) {
console.log(toCity);
}
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="myCtrl" class="suggestField">
<select id="cityname" ng-model="toCity" ng-options="item as item.PlaceName for item in fromSuggestData">
<option value="">Select</option>
</select>
<button ng-click="submitForm(toCity.PlaceId)">SUBMIT</button>
</div>

AngularJS retrieve data and display with ng-change

I have a function to add records to database.
What I need to do is when I select an option all necessary fields must be filled with data.
I'm just new with angularjs and want to learn how to do this.
below is my code.
template
<div class="col-md-10">
<div class="col-md-12">
<div class="form-group">
<label>Select Employee </label>
<select class="form-control" ng-change='getData()' id='empId' ng-model="empId" ng-options="opt.id as opt.value for opt in employees">
</select>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label>Department <i class="required">*</i></label>
<select class="form-control" ng-change ="getPos()" ng-model="data.Employee.departmentId" ng-options="opt.id as opt.value for opt in deparments" data-validation-engine="validate[required]">
</select>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label>Position <i class="required">*</i></label>
<select class="form-control" ng-model="data.Employee.positionId" data-validation-engine="validate[required]">
</select>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label>Rate <i class="required">*</i></label>
<input type="text" class="form-control" ng-model="data.Employee.rate" data-validation-engine="validate[required]">
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label>Loan Amount <i class="required">*</i></label>
<input type="text" class="form-control" ng-model="data.Loan.amount" data-validation-engine="validate[required]">
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label>Period (months) <i class="required">*</i></label>
<input type='text' class="form-control" ng-model="data.Loan.amount" data-validation-engine="validate[required]">
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label>Date Start<i class="required">*</i></label>
<input type="text" class="form-control text-left" id="dateStart" ng-model="data.Employee.contractFrom" data-validation-engine="validate[required]" id="contractFrom">
</div>
</div>
</div>
controller
app.controller('LoanAddController', function($scope, Loan,Select) {
$('#form').validationEngine('attach');
$scope.load = function() {
Loan.get({ id: $scope.employeeId }, function(e) {
$scope.data = e.data;
});
Select.get({ code: 'departments' }, function(e) {
$scope.departments = e.data;
});
// employees selection
Select.get({ code: 'employees' }, function(e) {
$scope.employees = e.data;
});
Select.get({ code: 'positions' }, function(e) {
$scope.positions = e.data;
});
}
$('#dateStart').datepicker({
format: 'mm/dd/yyyy',
autoclose: true
});
$scope.load();
// save loan data
$scope.save = function() {
valid = $("#form").validationEngine('validate');
if (valid) {
Loan.save($scope.data, function(e) {
if (e.ok) {
$.gritter.add({
title: 'Successful!',
text: e.msg,
});
window.location = '#/loans';
} else {
$.gritter.add({
title: 'Warning!',
text: e.msg,
});
}
});
}
}
});
some JSON data
{
"ok": true,
"data": [
{
"Loan": {
"id": "1",
"employeeId": "9",
"dateApplied": "2015-10-15",
"amount": "5000",
"period": "6",
"startdate": "2015-11-01",
"status": "pending",
"visible": true,
"created": "0000-00-00 00:00:00",
"modified": "0000-00-00 00:00:00"
},
"Employee": {
"id": "9",
"employeeNumber": "24681012",
"lastName": "Cortez",
"firstName": "Kim Carlo",
"middleName": "Mira",
"departmentId": "1",
"positionId": "4",
"rate": "600",
"typeId": "8",
"dateHired": "2015-10-22",
"contractFrom": "2015-10-31",
"contractTo": "2016-10-31",
"image": "9.PNG",
"visible": true,
"created": "2015-10-07 08:25:56",
"modified": "2015-10-07 08:25:56"
},
"Department": {
"id": null,
"code": null,
"name": null,
"description": null,
"visible": null,
"created": null,
"modified": null
},
"Position": {
"id": "9",
"name": "Bell boy",
"departmentId": "6",
"description": "bellboy, ice cream vendor",
"visible": true,
"created": "2015-10-06 13:52:43",
"modified": "2015-10-06 13:52:43"
}
}
],
"paginator": {
"page": 1,
"current": 1,
"count": 1,
"prevPage": false,
"nextPage": false,
"pageCount": 1,
"order": {
"Loan.id": "ASC"
},
"limit": 25,
"options": [
],
"paramType": "named"
}
}
I have to populate the fields for employee details.
Any help would be appreciated.
Thank guys,

Angular Js orderBy with numeric field is not working

In controller I have written code that convert rank into Float
details.rank = '';
$scope.order = function (predicate) {
$scope.reverse = ($scope.predicate === predicate) ? !$scope.reverse : false;
if (predicate == 'rank') {
for (var i = 0; i < data.countries[$scope.index].cities.length; i++) {
details.rank = parseFloat(data.countries[$scope.index].cities[i].rank);
}
$scope.predicate = predicate;
} else $scope.predicate = predicate;
};
but here I am getting error that ReferenceError: details is not defined
I have json like this:
{
"countries": [{
"country": "India",
"cities": [{
"name": "Bangalore",
"rank": "40"
}, {
"name": "Kolkata",
"rank": "54"
}, {
"name": "Mumbai",
"rank": "32"
}, {
"name": "Chennai",
"rank": "42"
}]
}, {
"country": "China",
"cities": [{
"name": "Guangzhou",
"rank": "111"
}, {
"name": "Beijing",
"rank": "90"
}, {
"name": "Fuzhou",
"rank": "21"
}, {
"name": "Baotou",
"rank": "23"
}]
}]
}
In html if I click header of table then it will sort the table both ascending and descending order but I am unable to do this.
<th>
RANK
<span ng-show="predicate === 'rank'" ng-class="{reverse:reverse}"> </span>
</th>
<ul ng-repeat="city in countryType">
<li ng-repeat="details in city.data.cities | orderBy:predicate:reverse">
<div class="text" id="t1"> {{details.name}} </div>
<div class="text" id="t2"> {{details.rank}}</div>
<div class="text" id="t3"> {{details.population}} </div>
<div class="text" id="t4"> {{details.language}}</div>
</li>
</ul>

You can make a dynamic sorting by clicking on the header divs doing like that :
<ul ng-repeat="city in countryType">
<li>
<div class="text" ng-click="orderListBy('name')"> Name </div>
<div class="text" ng-click="orderListBy('rank')"> Rank</div>
<div class="text" ng-click="orderListBy('population')"> Population </div>
<div class="text" ng-click="orderListBy('language')"> Language</div>
</li>
<li ng-repeat="details in city.data.cities | orderBy:predicate:reverse">
<div class="text" id="t1-{{$index}}"> {{details.name}} </div>
<div class="text" id="t2-{{$index}}"> {{details.rank}}</div>
<div class="text" id="t3-{{$index}}"> {{details.population}} </div>
<div class="text" id="t4-{{$index}}"> {{details.language}}</div>
</li>
</ul>
And in your controller
//initialize values
$scope.predicate = 'rank';
$scope.reverse = false;
$scope.orderListBy = function(attr){
$scope.predicate = attr;
$scope.reverse = !$scope.reverse;
};
Doing so it will revert the sort when re-clicking on the header of a column.
PS : don't forget to dynamically name your IDs in the ng-repeat directive to avoid errors and have a valid HTML code.

'pageNumber' value in data parameter is not passed through $.ajax() call made

I have been trying to do pagination using jquery to display item details through an eBay API using PHP as the back end. The other parameters are passed easily to the PHP file except for the page number parameter in the data section of the $.ajax() call and hence even though the call is successful, only the first page is shown for every page clicked. Can anybody point out what is going wrong?
Here is a part of the code:
function paginatingRetrieval(pageno)
{
alert("calling the page number "+pageno);
alert("the page is "+pages);
$.ajax(
{
type: "GET",
url: "ResponseProg.php",
datatype: "json",
data:
{
keywords:$("#kw").val(),
Results:$("#rslts option:selected").val(),
SortOrder:$("#srt option:selected").val(),
MinPrice:$("#mn").val(),
MaxPrice:$("#mx").val(),
New:$("#Nw").is(':checked') ? $("#Nw").val() : "notset",
Used:$("#Usd").is(':checked') ? $("#Usd").val() : "notset",
Very_Good:$("#Vg").is(':checked') ? $("#Vg").val() : "notset",
Good:$("#Gd").is(':checked') ? $("#Gd").val() : "notset",
Acceptable:$("#Ac").is(':checked') ? $("#Ac").val() : "notset",
ListingType_1:$("#bin").is(':checked') ? $("#bin").val() : "notset",
ListingType_2:$("#actn").is(':checked') ? $("#actn").val() : "notset",
ListingType_3:$("#Ca").is(':checked') ? $("#Ca").val() : "notset",
ReturnsAcceptedOnly:$("#Ra").is(':checked') ? $("#Ra").val() : "notset",
FreeShippingOnly:$("#Fs").is(':checked') ? $("#Fs").val() : "notset",
ExpeditedShippingAvailable:$("#Esa").is(':checked') ? $("#Esa").val() : "notset",
MaxHandlingTime:$("#Mhtd").val(),
pageNumber:pageno
},
success: function(data)
{
JSONObj = jQuery.parseJSON(data);
$("#rtrn").html("data successfully retrieved for page number "+pageno+"\n "+data);
//contentProvider("#rtrn");
},
error: function()
{
$("#rtrn").html("Data not retrieved successfully");
}
});
}
Here is part of the HTML code that is involved in the calling of the function:
var page='<ul class="pagination" id="pager">'+
'<li id="prev">'+
'<a href="#" id="prev" aria-label="Previous">'+
'<span aria-hidden="true">«</span>'+
'</a>'+
'</li>';
for(i=1;i<=5;i++)
{
var index=ind+i;
page+='<li id="'+index+'">'+index+'</li>';
}
page+='<li>'+
'<a href="#" id="next" aria-label="next">'+
'<span aria-hidden="true">»</span>'+
'</a>'+
'</li>'+
'</ul>';
return page;
I am trying to display only 5 pages as of now and not working on the previous and next buttons. Every time I click a button on the pagination, the same result is displayed.
This is the JSON retrieved on giving the keyword:'IKEA' min price:0 max price:100 and max handling time:7 and every time a pagination button is clicked say 2, 3 etc it always shows the first page.
{
"ack": "Success",
"resultCount": 23624,
"pageNumber": 1,
"itemCount": 5,
"item0": {
"basicInfo": {
"title": "IKEA HOLMO Floor lamp light white Rice paper shade Modern Contemporary New",
"viewitemURL": "http://www.ebay.com/itm/IKEA-HOLMO-Floor-lamp-light-white-Rice-paper-shade-Modern-Contemporary-New-/371340016191?pt=LH_DefaultDomain_0",
"galleryURL": "http://thumbs4.ebaystatic.com/m/mmkMl3fVtDHRy80P_StIYgg/140.jpg",
"pictureURLSuperSize": "http://i.ebayimg.com/00/s/NTAwWDUwMA==/z/-44AAOxygPtS57Qk/$_12.JPG",
"convertedCurrentPrice": 6.99,
"shippingServiceCost": 10.99,
"conditionDisplayName": "New",
"listingType": "StoreInventory",
"location": "Baltimore,MD,USA",
"categoryName": "Lamps",
"topRatedListing": "true"
},
"sellerInfo": {
"sellerUserName": "jx035md",
"feedbackScore": 10357,
"positiveFeedbackPercent": 100,
"feedbackRatingStar": "YellowShooting",
"topRatedSeller": "true",
"sellerStoreName": "",
"sellerStoreURL": ""
},
"shippingInfo": {
"shippingType": "FlatDomesticCalculatedInternational",
"shipToLocations": [
"US",
"CA",
"GB",
"AU",
"AT",
"BE",
"FR",
"DE",
"IT",
"JP",
"ES",
"TW",
"NL",
"CN",
"HK",
"MX",
"DK",
"RO",
"SK",
"BG",
"CZ",
"FI",
"HU",
"LV",
"LT",
"MT",
"EE",
"GR",
"PT",
"CY",
"SI",
"SE",
"KR",
"ID",
"ZA",
"TH",
"IE",
"PL",
"RU",
"IL"
],
"expeditedShipping": "false",
"oneDayShippingAvailable": "false",
"returnsAccepted": "true",
"handlingTime": 1
}
},
"item1": {
"basicInfo": {
"title": "New IKEA Ektorp loveseat Idemo beige slipcover cover 2-seat sofa ",
"viewitemURL": "http://www.ebay.com/itm/New-IKEA-Ektorp-loveseat-Idemo-beige-slipcover-cover-2-seat-sofa-/331569715403?pt=LH_DefaultDomain_0",
"galleryURL": "http://thumbs4.ebaystatic.com/m/m31xhZMrlY5bQeEWqRt87wQ/140.jpg",
"pictureURLSuperSize": "http://i.ebayimg.com/00/s/NTAwWDUwMA==/z/9sgAAOSwKrhVaf2Z/$_12.JPG",
"convertedCurrentPrice": 75,
"shippingServiceCost": 0,
"conditionDisplayName": "New other (see details)",
"listingType": "AuctionWithBIN",
"location": "Houghton,MI,USA",
"categoryName": "Slipcovers",
"topRatedListing": "false"
},
"sellerInfo": {
"sellerUserName": "jmack55",
"feedbackScore": 149,
"positiveFeedbackPercent": 100,
"feedbackRatingStar": "Turquoise",
"topRatedSeller": "false",
"sellerStoreName": "",
"sellerStoreURL": ""
},
"shippingInfo": {
"shippingType": "Free",
"shipToLocations": [
"US",
"CA",
"GB",
"AU",
"AT",
"BE",
"FR",
"DE",
"IT",
"JP",
"ES",
"TW",
"NL",
"CN",
"HK",
"MX",
"DK",
"RO",
"SK",
"BG",
"CZ",
"FI",
"HU",
"LV",
"LT",
"MT",
"EE",
"GR",
"PT",
"CY",
"SI",
"SE",
"KR",
"ID",
"TH",
"IE",
"PL",
"RU",
"IL",
"NZ"
],
"expeditedShipping": "true",
"oneDayShippingAvailable": "false",
"returnsAccepted": "false",
"handlingTime": 3
}
},
"item2": {
"basicInfo": {
"title": "Floor Lamp Light Ikea Holmo with Rice Paper Shade Modern Contemporary NEW ",
"viewitemURL": "http://www.ebay.com/itm/Floor-Lamp-Light-Ikea-Holmo-Rice-Paper-Shade-Modern-Contemporary-NEW-/371342969642?pt=LH_DefaultDomain_0",
"galleryURL": "http://thumbs3.ebaystatic.com/m/mcqESoYv3si3-U-n24F3LLQ/140.jpg",
"pictureURLSuperSize": "http://i.ebayimg.com/00/s/NTAwWDUwMA==/z/lNsAAOxy4dBRnOxf/$T2eC16F,!ygE9s7HHgu8BRnO)fjdsg~~60_3.JPG",
"convertedCurrentPrice": 19.99,
"shippingServiceCost": 0,
"conditionDisplayName": "New",
"listingType": "StoreInventory",
"location": "USA",
"categoryName": "Lamps",
"topRatedListing": "true"
},
"sellerInfo": {
"sellerUserName": "homeanddecor",
"feedbackScore": 22218,
"positiveFeedbackPercent": 99.4,
"feedbackRatingStar": "YellowShooting",
"topRatedSeller": "true",
"sellerStoreName": "",
"sellerStoreURL": ""
},
"shippingInfo": {
"shippingType": "Free",
"shipToLocations": "US",
"expeditedShipping": "true",
"oneDayShippingAvailable": "false",
"returnsAccepted": "true",
"handlingTime": 1
}
},
"item3": {
"basicInfo": {
"title": "FILLSTA Table White Lamp ",
"viewitemURL": "http://www.ebay.com/itm/FILLSTA-Table-White-Lamp-/331571817429?pt=LH_DefaultDomain_0",
"galleryURL": "http://thumbs2.ebaystatic.com/m/mQm7GQdmQ4cM4pCKUWo0h1g/140.jpg",
"pictureURLSuperSize": "http://i.ebayimg.com/00/s/NTAwWDUwMA==/z/5DEAAOSwl8NVbMuF/$_12.JPG",
"convertedCurrentPrice": 7.99,
"shippingServiceCost": 0,
"conditionDisplayName": "Used",
"listingType": "Auction",
"location": "Jacksonville,FL,USA",
"categoryName": "Lamps",
"topRatedListing": "false"
},
"sellerInfo": {
"sellerUserName": "clee9064",
"feedbackScore": 84,
"positiveFeedbackPercent": 100,
"feedbackRatingStar": "Blue",
"topRatedSeller": "false",
"sellerStoreName": "",
"sellerStoreURL": ""
},
"shippingInfo": {
"shippingType": "Calculated",
"shipToLocations": [
"US",
"CA",
"GB",
"AU",
"AT",
"BE",
"FR",
"DE",
"IT",
"JP",
"ES",
"TW",
"NL",
"CN",
"HK",
"MX",
"DK",
"RO",
"SK",
"BG",
"CZ",
"FI",
"HU",
"LV",
"LT",
"MT",
"EE",
"GR",
"PT",
"CY",
"SI",
"SE",
"KR",
"ID",
"TH",
"IE",
"PL",
"RU",
"IL",
"NZ"
],
"expeditedShipping": "true",
"oneDayShippingAvailable": "false",
"returnsAccepted": "true",
"handlingTime": 2
}
},
"item4": {
"basicInfo": {
"title": "IKEA HOLMO Floor lamp light white Rice paper shade Modern Contemporary brand new",
"viewitemURL": "http://www.ebay.com/itm/IKEA-HOLMO-Floor-lamp-light-white-Rice-paper-shade-Modern-Contemporary-brand-new-/171742977475?pt=LH_DefaultDomain_0",
"galleryURL": "http://thumbs4.ebaystatic.com/m/myaABTkDgQyLgI55COQjcIA/140.jpg",
"pictureURLSuperSize": "http://i.ebayimg.com/00/s/OTYwWDU0MA==/z/KzIAAOSwBahVHbbq/$_3.JPG",
"convertedCurrentPrice": 8.95,
"shippingServiceCost": 0,
"conditionDisplayName": "New",
"listingType": "StoreInventory",
"location": "Longwood,FL,USA",
"categoryName": "Lamps",
"topRatedListing": "true"
},
"sellerInfo": {
"sellerUserName": "xclusive-deals-com",
"feedbackScore": 740,
"positiveFeedbackPercent": 100,
"feedbackRatingStar": "Purple",
"topRatedSeller": "true",
"sellerStoreName": "",
"sellerStoreURL": ""
},
"shippingInfo": {
"shippingType": "Calculated",
"shipToLocations": "Worldwide",
"expeditedShipping": "true",
"oneDayShippingAvailable": "false",
"returnsAccepted": "true",
"handlingTime": 1
}
}
}
here is the php code:
<?php
if(isset($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest')
{
$call="";
$response;
$c=0;
$l=0;
$pms=0;
$url="http://svcs.eBay.com/services/search/FindingService/v1?siteid=0&SECURITY-APPNAME=Universi-9b52-4bc2-b847-385688b5de53&OPERATION-NAME=findItemsAdvanced&SERVICE-VERSION=1.0.0&RESPONSE-DATA-FORMAT=XML";
if($_SERVER["REQUEST_METHOD"] == "GET")
{
$call.=$url;
if(isset($_GET["keywords"]) and $_GET["keywords"]!='' and $_GET["keywords"] != 'notset')
{
$enc = urlencode(utf8_encode($_GET["keywords"]));
$call.="&keywords=".$enc;
}
if(isset($_GET["Results"]) and $_GET["Results"]!='' and $_GET["Results"] != 'notset')
{
$call.="&paginationInput.entriesPerPage=".$_GET["Results"];
}
if(isset($_GET["SortOrder"]) and $_GET["SortOrder"]!='' and $_GET["SortOrder"] != 'notset')
{
$call.="&sortOrder=".$_GET["SortOrder"];
}
if(isset($_GET["MinPrice"]) and $_GET["MinPrice"]!='' and $_GET["MinPrice"] != 'notset')
{ $call.="&itemFilter(".$pms.").name=MinPrice&itemFilter(".$pms.").value=".$_GET["MinPrice"];
$pms++;
}
if(isset($_GET["MaxPrice"]) and $_GET["MaxPrice"]!='' and $_GET["MaxPrice"] != 'notset')
{
$call.="&itemFilter(".$pms.").name=MaxPrice&itemFilter(".$pms.").value=".$_GET["MaxPrice"];
$pms++;
}
$numhand = $_GET["MaxHandlingTime"];
if($numhand != "")
{
if(in_array($numhand,$_GET))
{
if(isset($_GET["MaxHandlingTime"]) and $_GET["MaxHandlingTime"]!='' and $_GET["MaxHandlingTime"] != 'notset')
{
$call.="&itemFilter(".$pms.").name=MaxHandlingTime&itemFilter(".$pms.").value=".$_GET["MaxHandlingTime"];
$pms++;
}
}
}
if(in_array("1000",$_GET) || in_array("3000",$_GET) || in_array("4000",$_GET) || in_array("5000",$_GET) || in_array("6000",$_GET))
{
$condition="&itemFilter(".$pms.").name=Condition";
$call.=$condition;
if(isset($_GET["New"]) and $_GET["New"]!='' and $_GET["New"] != 'notset')
{
$call.="&itemFilter(".$pms.").value(".$c.")=".$_GET["New"];
$c++;
}
if(isset($_GET["Used"]) and $_GET["Used"]!='' and $_GET["Used"] != 'notset')
{
$call.="&itemFilter(".$pms.").value(".$c.")=".$_GET["Used"];
$c++;
}
if(isset($_GET["Very_Good"]) and $_GET["Very_Good"]!='' and $_GET["Very_Good"] != 'notset')
{
$call.="&itemFilter(".$pms.").value(".$c.")=".$_GET["Very_Good"];
$c++;
}
if(isset($_GET["Good"]) and $_GET["Good"]!='' and $_GET["Good"] != 'notset')
{
$call.="&itemFilter(".$pms.").value(".$c.")=".$_GET["Good"];
$c++;
}
if(isset($_GET["Acceptable"]) and $_GET["Acceptable"]!='' and $_GET["Acceptable"] != 'notset')
{
$call.="&itemFilter(".$pms.").value(".$c.")=".$_GET["Acceptable"];
}
$pms++;
}
if( in_array("FixedPrice",$_GET) || in_array("Auction",$_GET) || in_array("Classified",$_GET))
{
$listing="&itemFilter(".$pms.").name=ListingType";
$call.=$listing;
if(isset($_GET["ListingType_1"]) and $_GET["ListingType_1"]!='' and $_GET["ListingType_1"] != 'notset')
{
$call.="&itemFilter(".$pms.").value(".$l.")=".$_GET["ListingType_1"];
$l++;
}
if(isset($_GET["ListingType_2"]) and $_GET["ListingType_2"]!='' and $_GET["ListingType_2"] != 'notset')
{
$call.="&itemFilter(".$pms.").value(".$l.")=".$_GET["ListingType_2"];
$l++;
}
if(isset($_GET["ListingType_3"]) and $_GET["ListingType_3"]!='' and $_GET["ListingType_3"] != 'notset')
{
$call.="&itemFilter(".$pms.").value(".$l.")=".$_GET["ListingType_3"];
}
$pms++;
}
if(in_array("ReturnsAcceptedOnly",$_GET))
{
if(isset($_GET["ReturnsAcceptedOnly"]) and $_GET["ReturnsAcceptedOnly"]!='' and $_GET["ReturnsAcceptedOnly"] != 'notset')
{
$call.="&itemFilter(".$pms.").name=ReturnsAcceptedOnly&itemFilter(".$pms.").value=true";
$pms++;
}
}
if(in_array("FreeShippingOnly",$_GET))
{
if(isset($_GET["FreeShippingOnly"]) and $_GET["FreeShippingOnly"]!='' and $_GET["FreeShippingOnly"] != 'notset')
{
$call.="&itemFilter(".$pms.").name=FreeShippingOnly&itemFilter(".$pms.").value=true";
$pms++;
}
}
if(in_array("Expedited",$_GET))
{
if(isset($_GET["ExpeditedShippingAvailable"]) and $_GET["ExpeditedShippingAvailable"]!='' and $_GET["ExpeditedShippingAvailable"] != 'notset')
{
$call.="&itemFilter(".$pms.").name=ExpeditedShippingType&itemFilter(".$pms.").value=Expedited";
$pms++;
}
}
$call.="&outputSelector[".$pms."]=SellerInfo";
$pms++;
$call.="&outputSelector[".$pms."]=PictureURLSuperSize";
$pms++;
$call.="&outputSelector[".$pms."]=StoreInfo";
if(isset($_GET["pageNumber"]))
{
$pgno = $_GET["pageNumber"];
$call.="&paginationInput.pageNumber="+$pgno;
}
$response = simplexml_load_file($call);
//$responseContent = file_get_contents($call);
//echo $call;
$entries=$response->paginationOutput->totalEntries;
$counter=$response->paginationOutput->entriesPerPage;
$result;
$items;
if($entries == 0)
{
$result["ack"] = "No results found";
}
else
{
$result["ack"] = (string)$response->ack;
$result["resultCount"] = (int)$response->paginationOutput->totalEntries;
$result["pageNumber"] = (int)$response->paginationOutput->pageNumber;
$result["itemCount"] = (int)$response->paginationOutput->entriesPerPage;
$cnt;
if($entries-$counter < 0)
{
$cnt = $entries;
}
if($entries-$counter > 0)
{
$cnt = $counter;
}
for($x=0;$x<$cnt;$x++)
{
$basicInfo;
$basicInfo["title"] = (string)$response->searchResult->item[$x]->title;
$basicInfo["viewitemURL"] = (string)$response->searchResult->item[$x]->viewItemURL;
$basicInfo["galleryURL"] = (string)$response->searchResult->item[$x]->galleryURL;
$basicInfo["pictureURLSuperSize"] = (string)$response->searchResult->item[$x]->pictureURLSuperSize;
$basicInfo["convertedCurrentPrice"] = (float)$response->searchResult->item[$x]->sellingStatus->convertedCurrentPrice;
$basicInfo["shippingServiceCost"] = (float)$response->searchResult->item[$x]->shippingInfo->shippingServiceCost;
$basicInfo["conditionDisplayName"] = (string)$response->searchResult->item[$x]->condition->conditionDisplayName;
$basicInfo["listingType"] = (string)$response->searchResult->item[$x]->listingInfo->listingType;
$basicInfo["location"] = (string)$response->searchResult->item[$x]->location;
$basicInfo["categoryName"] = (string)$response->searchResult->item[$x]->primaryCategory->categoryName;
$basicInfo["topRatedListing"] = (string)$response->searchResult->item[$x]->topRatedListing;
$sellerInfo;
$sellerInfo["sellerUserName"] = (string)$response->searchResult->item[$x]->sellerInfo->sellerUserName;
$sellerInfo["feedbackScore"] = (float)$response->searchResult->item[$x]->sellerInfo->feedbackScore;
$sellerInfo["positiveFeedbackPercent"] = (float)$response->searchResult->item[$x]->sellerInfo->positiveFeedbackPercent;
$sellerInfo["feedbackRatingStar"] = (string)$response->searchResult->item[$x]->sellerInfo->feedbackRatingStar;
$sellerInfo["topRatedSeller"] = (string)$response->searchResult->item[$x]->sellerInfo->topRatedSeller;
$sellerInfo["sellerStoreName"] = (string)$response->searchResult->item[$x]->storeInfo->storeName;
$sellerInfo["sellerStoreURL"] = (string)$response->searchResult->item[$x]->storeInfo->storeURL;
$shippingInfo;
$shippingInfo["shippingType"] = (string)$response->searchResult->item[$x]->shippingInfo->shippingType;
if(count((array)$response->searchResult->item[$x]->shippingInfo->shipToLocations) > 1)
{
$shippingInfo["shipToLocations"] = (array)$response->searchResult->item[$x]->shippingInfo->shipToLocations;
}
else if(count((array)$response->searchResult->item[$x]->shippingInfo->shipToLocations) == 1)
{
$shippingInfo["shipToLocations"] = (string)$response->searchResult->item[$x]->shippingInfo->shipToLocations;
}
$shippingInfo["expeditedShipping"] = (string)$response->searchResult->item[$x]->shippingInfo->expeditedShipping;
$shippingInfo["oneDayShippingAvailable"] = (string)$response->searchResult->item[$x]->shippingInfo->oneDayShippingAvailable;
$shippingInfo["returnsAccepted"] = (string)$response->searchResult->item[$x]->returnsAccepted;
$shippingInfo["handlingTime"] = (int)$response->searchResult->item[$x]->shippingInfo->handlingTime;
$itemdetails["basicInfo"]=$basicInfo;
$itemdetails["sellerInfo"]=$sellerInfo;
$itemdetails["shippingInfo"]=$shippingInfo;
$result["item".$x]=$itemdetails;
}
}
$rsltjson = json_encode($result,JSON_UNESCAPED_SLASHES);
echo $rsltjson;
}
}
?>
this is the code for the form:
<div><form id="ecomm" name="ebfrm" action="" method="GET">
<fieldset>
<div class="row">
<div class="col-sm-2" align="right"><label>Key Words<span style="color:red;">*</span>:</label></div>
<div class="col-sm-10"><input type="text" class="form-control" name="keywords" id="kw" placeholder="Enter keyword"></div>
</div>
<br>
<div class="row">
<div class="col-sm-2" align="right"><label>Price Range:</label></div>
<div class="col-sm-5"><input type="text" class="form-control" id="mn" placeholder="from ($)" name="MinPrice" ></div>
<div class="col-sm-5"><input type="text" class="form-control" id="mx" placeholder="to ($)" name="MaxPrice" ></div>
</div>
<br>
<div class="row">
<div class="col-sm-2" align="right"><label>Condition:</label></div>
<div class="col-sm-10">
<label class="checkbox-inline"><input type="checkbox" id="Nw" name="New" value="1000" >New</label>
<label class="checkbox-inline"><input type="checkbox" id="Usd" name="Used" value="3000" >Used</label>
<label class="checkbox-inline"><input type="checkbox" id="Vg" name="Very_Good" value="4000" >Very Good</label>
<label class="checkbox-inline"><input type="checkbox" id="Gd" name="Good" value="5000" >Good</label>
<label class="checkbox-inline"><input type="checkbox" id="Ac" name="Acceptable" value="6000" >Acceptable</label>
</div>
</div>
<br>
<div class="row">
<div class="col-sm-2" align="right"><label>Buying Formats:</label></div>
<div class="col-sm-10">
<label class="checkbox-inline"><input type="checkbox" id="bin" name="ListingType_1" value="FixedPrice" >Buy it Now</label>
<label class="checkbox-inline"><input type="checkbox" id="actn" name="ListingType_2" value="Auction" >Auction</label>
<label class="checkbox-inline"><input type="checkbox" id="Ca" name="ListingType_3" value="Classified" >Classified Ads</label>
</div>
</div>
<br>
<div class="row">
<div class="col-sm-2" align="right"><label>Seller:</label></div>
<div class="col-sm-10">
<label class="checkbox-inline"><input type="checkbox" id="Ra" name="ReturnsAcceptedOnly" value="ReturnsAcceptedOnly" >Return Accepted</label>
</div>
</div>
<br>
<div class="row">
<div class="col-sm-2" align="right"><label>Shipping:</label></div>
<div class="col-sm-10">
<label class="checkbox-inline"><input type="checkbox" id="Fs" name="FreeShippingOnly" value="FreeShippingOnly" >Free Shipping</label>
<label class="checkbox-inline"><input type="checkbox" id="Esa" name="ExpeditedShippingAvailable" value="Expedited" >Expedited shipping available</label>
</div>
</div>
<br>
<div class="row">
<div class="col-sm-2"></div>
<div class="col-sm-10"><input type="text" class="form-control" id="Mhtd" placeholder="Max handling time(days)" name="MaxHandlingTime" ></div>
</div>
<br>
<div class="row">
<div class="col-sm-2" align="right"><label>Sort by:</label></div>
<div class="col-sm-10"><select class="form-control" id="srt" name="SortOrder">
<option value="BestMatch" >Best Match</option>
<option value="CurrentPriceHighest" >Price: highest first</option>
<option value="PricePlusShippingHighest" >Price + Shipping: highest first</option>
<option value="PricePlusShippingLowest" >Price + Shipping: lowest first</option>
</select></div>
</div>
<br>
<div class="row">
<div class="col-sm-2" align="right"><label>Result per page:</label></div>
<div class="col-sm-10"><select class="form-control" id="rslts" name="Results">
<option value="5" >5</option>
<option value="10" >10</option>
</select></div>
</div>
<br>
<div align="right">
<button type="button" id="btn" class="btn btn-default" name="clear" onclick="clean();">clear</button>
<input type="submit" id="sbmt" class="btn btn-primary" name="search" value="search">
</div>
</fieldset><br>
</form></div>
Update: I solved the problem...it was a typo in the php program

We Keep Coding

JavaScript is the programming language of the Web.

Select options disapear when i select item (Angular) - javascript

Related

Sorting Data from External JS File Numerically by Price

How to get label of an input field when submit a form in Angular JS

AngularJS retrieve data and display with ng-change

Angular Js orderBy with numeric field is not working

'pageNumber' value in data parameter is not passed through $.ajax() call made

Categories

Resources