We Keep Coding

How do I update the shipping options at checkout in BigCommerce

I've written a custom app which uses a PHP server for the back end and the bigcommerce checkout/cart sdk with JS for the front end.
Basically this is what I want to do:
Retrieve Rates using my php app and a 3rd party api (This works)
Display said rates as selectable options (This works)
Update the checkout and consignment (This works but not 100%)
Update the cart shipping method and total (This is where I am stuck)
After I get the rates from the PHP server, I dynamically build the list's HTML.
I randomly assign shipping method id's (As I have no idea how this gets generated but it appears to be fairly random)
When I click on a shipping option this code runs (Please note that 'option' is a variable within a foreach loop
console.dir(checkoutObj);
if(checkoutObj.consignments.length < 1){
console.log('no consign');
} else {
var selectedShipping = checkoutObj.consignments[0].selectedShippingOption;
selectedShipping.cost = parseFloat(option['grandtotmrkup']);
selectedShipping.description = option['CarrierName'] + '-' + option['CarrierService'];
selectedShipping.id = this.value;
selectedShipping.type = 'weight_based_shipping';
checkoutObj.consignments[0].shippingCost = parseFloat(option['grandtotmrkup']);
checkoutObj.shippingCostBeforeDiscount = parseFloat(option['grandtotmrkup']);
checkoutObj.shippingCostTotal = parseFloat(option['grandtotmrkup']);
console.log('updated checkout obj');
console.dir(checkoutObj);
var updated = service.updateCheckout(checkoutObj);
console.log('updated');
console.dir(state.data.getCheckout());
console.log('updating consignment');
console.dir(
service.updateConsignment({'id':consignID,'shippingOptionId':shippingMethodId})
);
console.dir(state.data.getConsignments());
When it runs service.updateConsignment I get the following response for the consignments section of the object:
"consignments": [
{
"id": "5f732875d039f",
"shippingCost": 0,
"handlingCost": 0,
"couponDiscounts": [],
"discounts": [],
"lineItemIds": [
"4f557702-4f9d-45ec-943a-c72ea963ccc7"
],
"selectedShippingOption": {
"id": "4dcbf24f457dd67d5f89bcf374e0bc9b",
"type": "freeshipping",
"description": "Free Shipping",
"imageUrl": "",
"cost": 0,
"transitTime": "",
"additionalDescription": ""
},
"shippingAddress": {
"firstName": "1",
"lastName": "1",
"email": "",
"company": "",
"address1": "1 street",
"address2": "",
"city": "MITCHAM",
"stateOrProvince": "Victoria",
"stateOrProvinceCode": "VIC",
"country": "Australia",
"countryCode": "AU",
"postalCode": "3132",
"phone": "",
"customFields": [],
"shouldSaveAddress": true
},
"availableShippingOptions": [
{
"id": "9ba45e71fe66e1cd757f022dcae331b0",
"type": "shipping_pickupinstore",
"description": "Pickup In Store",
"imageUrl": "",
"cost": 0,
"transitTime": "",
"isRecommended": false,
"additionalDescription": ""
},
{
"id": "4dcbf24f457dd67d5f89bcf374e0bc9b",
"type": "freeshipping",
"description": "Free Shipping",
"imageUrl": "",
"cost": 0,
"transitTime": "",
"isRecommended": true,
"additionalDescription": ""
}
]
}
],
I'm not sure if it's because my shipping options aren't in the Available Shipping Options Section of the object?
Does anyone know how I can get my shipping methods in there? Or is this being caused because I append the methods dyanmically via HTML?
I'm new to BC so please excuse any ignorance.

I don't think you're going to be able to inject a shipping option into the checkout this way, I think you'd need to look at using the Shipping Methods API in your PHP app and then the options should be available as per usual.

Not able to read below JSON using Angular 7

I was not able to read below mentioned received JSON from Rest API.
{
"details": {
"id": 21,
"gstin": "27AACCG7831Q1Z0",
"entityName": "GENX ENTERTAINMENT LIMITED",
"entityPan": "AACCG7831Q",
"entityTan": "abhishek123",
"entityCin": "null",
"entityWebsite": null,
"natureOfBusiness": null,
"constitution": "\"Public Limited Company\""
},
"addresses": [
{
"id": 22,
"buildingName": "\"Solitaire Corporate Park\"",
"location": null,
"street": null,
"buildingNo": "\"S-14\"",
"state": "bihar",
"district": "\"\"",
"city": "\"\"",
"flateNo": "\"1\"",
"pincode": "\"400093\"",
"isPrimary": false
}
]
}
I want to use above data received in JSON format into a form.

Your question is not clear, but you can pass this values to a form using this :
const formValues = JSON.parse(yourJson);
this.form.values = formValues;

See The Stakblitz Code Below
stackblit_sampleCode
Hope this helps..!

Setting 3rd Level Nested Attribute on a Backbone Model

I'm having trouble changing the location $id on this Backbone model.
{
"approved": null,
"caption": "This is my photo!",
"created": 1393537913,
"location": {
"_id": {
"$id": 5
},
"address1": "155 West Street",
"city": "Bangkok",
"country": "THA",
"latitude": "13.136",
"longitude": "100.2068",
"postalCode": "10330",
"region": "AP"
}
}
I've tried:
model.set({"location":{"_id":{"$id": 6}}})
But that obviously overwrites the entire location object.
model.set({"location._id":{"$id":6}})
Creates a new attribute on the model, "location._id".
So, how can I dig in to the location to change that attribute?

You can do like this :
var location = model.get('location');
location._id = { "$id": 6 };

Proper way to send JSON to Shopify across servers (Private App)

I am working with a private app on my Shopify store and am racking my brain trying to post JSON to my store via Ajax.
This is the data (sample)
var newCustomer = {
"customer": {
"first_name": "Steve",
"last_name": "Lastnameson",
"email": "steve.lastnameson#lastnamesonco.com",
"verified_email": true,
"addresses": [
{
"address1": "123 Oak St",
"city": "Ottawa",
"country": "CA",
"first_name": "Mother",
"last_name": "Lastnameson",
"phone": "555-1212",
"province": "ON",
"zip": "123 ABC"
}
]
}
};
And this is my Ajax call (Note: the url is not the one I use in the actual call)
$.ajax({
type: "POST",
url: "https://apikey:password#hostname/admin/resource.json",
data: newCustomer,
contentType: "application/json",
dataType: "jsonp",
success: function(){console.log('Success');},
failure: function(){console.log('Failure');}
});
This a cross domain call.
I do not get any results in my console.log at all.
Have any Shopify Users successfully done this?
Here is some documentation on either a getting or posting from Shopify

Decode Json Response from Ajax Call

I am getting a json response from python script via a ajax call on my html page, which I am running on localhost. When I alert/display the response it is in proper ajax format but I don't know how to decode it. JSON parse display [object] [object]. Any help? Thanks in advance.
HTML:
function getData() {
// Code doesn't even enter this function but when i remove the $.ajax part it enters the function
alert("I AM HERE");
$.ajax({
type: "GET",
datatype: 'json',
url: "/cgi-bin/check.py",
data: {
action: 'muawia()',
},
success: function(data) {
alert(data);
},
error: function(data) {
alert(data.responseText);
}
});
};
Python:
#!/usr/bin/python
import cgi, cgitb
from StringIO import StringIO
import json
class myclass:
def __init__(self):
self.data = []
def muawia(self):
content=json.loads('{"access": {"token": {"issued_at": "2013-04-18T14:40:23.299903", "expires": "2013-04-19T14:40:23Z", "id": "4c5ef01f52c7404fb5324c520d25d1fe", "tenant": {"description": "admin tenant", "enabled": true, "id": "51ad87714b86442d9a74537d6f890060", "name": "admin"}}, "serviceCatalog": [{"endpoints": [{"adminURL": "http://10.199.0.250:8774/v2/51ad87714b86442d9a74537d6f890060", "region": "RegionOne", "internalURL": "http://10.199.0.250:8774/v2/51ad87714b86442d9a74537d6f890060", "id": "9869f55f0de2490685676b6ec27f6097", "publicURL": "http://10.199.0.250:8774/v2/51ad87714b86442d9a74537d6f890060"}], "endpoints_links": [], "type": "compute", "name": "nova"}, {"endpoints": [{"adminURL": "http://10.199.0.250:8080", "region": "RegionOne", "internalURL": "http://10.199.0.250:8080", "id": "321601d827ba4bbbb6de1df69fd43a1c", "publicURL": "http://10.199.0.250:8080"}], "endpoints_links": [], "type": "s3", "name": "swift_s3"}, {"endpoints": [{"adminURL": "http://10.199.0.250:9292", "region": "RegionOne", "internalURL": "http://10.199.0.250:9292", "id": "cca7d7a24dbe45b6ae08da2c023b0d82", "publicURL": "http://10.199.0.250:9292"}], "endpoints_links": [], "type": "image", "name": "glance"}, {"endpoints": [{"adminURL": "http://10.199.0.250:8776/v1/51ad87714b86442d9a74537d6f890060", "region": "RegionOne", "internalURL": "http://10.199.0.250:8776/v1/51ad87714b86442d9a74537d6f890060", "id": "14773153229d4e7f80e47cf7b1dd2d15", "publicURL": "http://10.199.0.250:8776/v1/51ad87714b86442d9a74537d6f890060"}], "endpoints_links": [], "type": "volume", "name": "cinder"}, {"endpoints": [{"adminURL": "http://10.199.0.250:8773/services/Admin", "region": "RegionOne", "internalURL": "http://10.199.0.250:8773/services/Cloud", "id": "064df72a67f54dffa68c07b8fc400bdb", "publicURL": "http://10.199.0.250:8773/services/Cloud"}], "endpoints_links": [], "type": "ec2", "name": "nova_ec2"}, {"endpoints": [{"adminURL": "http://10.199.0.250:8080/", "region": "RegionOne", "internalURL": "http://10.199.0.250:8080/v1/AUTH_51ad87714b86442d9a74537d6f890060", "id": "194df182a8c043e48175a40fb615064e", "publicURL": "http://10.199.0.250:8080/v1/AUTH_51ad87714b86442d9a74537d6f890060"}], "endpoints_links": [], "type": "object-store", "name": "swift"}, {"endpoints": [{"adminURL": "http://10.199.0.250:35357/v2.0", "region": "RegionOne", "internalURL": "http://10.199.0.250:5000/v2.0", "id": "34db74b5f32f4121932725b1146a1701", "publicURL": "http://10.199.0.250:5000/v2.0"}], "endpoints_links": [], "type": "identity", "name": "keystone"}], "user": {"username": "admin", "roles_links": [], "id": "b5902682120742baa150945d8a37ff47", "roles": [{"name": "admin"}], "name": "admin"}, "metadata": {"is_admin": 0, "roles": ["9aa2eb385f4e4a8e80ad5002c212e76b"]}}}')
data=json.dumps(content, indent=4, separators = (', ', ': '))
print data
return
print "Content-Type: text/html\n"
x = myclass()
x.muawia()

You should use
console.log(data)
rather than alert(data). Alert will only show you strings

alert() only outputs strings. So generally it would be the same as:
data = data.toString();
alert(data);
Use console.log or console.dir in combination with JSON.parse to show the actual object that is returned from the JSON.parse.
// In your $.ajax success method
var someVar = JSON.parse(data);
console.log(someVar);
You can also set it to a global variable temporarily to debug it via the Firebug/Chrome DevTools console by typing its name. For example:
// In your $.ajax success method
window.data = data;
And then type "data" in your console.
Please note that this is a bad practice to ship to production, global variables cannot be garbage collected by your browsers JavaScript engine and especially a global variable name as data has a high possibility of turning into a conflict with other global variables. If you still want to use a global for some reason then make sure you use a solid naming convention to prevent error.

That's absolutely normal as JSON.parse(stringData) create s normal JavaScript object, so you get the [object Object] in the alert. You have to access each object's property to get its value. In your case
var jsonObj = JSON.parse(data);
alert(jsonObj.access.token.issued_at);
will be for instance "2013-04-18T14:40:23.299903"

You can use $.parseJSON to format your data correctly. You may also want to remove the extra comma at the end of your error response function. It can cause syntax errors. Remove the comma from "action: 'muawia()'," as well.
success: function(data){
r = $.parseJSON(data)
alert(r.responseText);
},
error: function(data){
r = $.parseJSON(data)
alert(r.responseText);
}
Hope this helps!