Develop Reference

$.POST on a squarespace page

I have a custom form that posts to a 3rd party server as an appointment booking module. If i submit the form thru the action of the <form> tag i do recieve the email, but i would like to submit the form using $.POST so that i can alter the redirect URL.
I have jQuery running successfully on my site, and if i use:
$.post('URL', {data}).then(function () {alert('Form Submitted!')});
The redirect (or alert for this example) works fine, but the POST doesnt seem to actually run. Has anyone had a similar issue and found a way to resolve this?
ACTUAL CODE
I am using mailthis.to's API to avoid having to run a server just to do this
$('#sendForm').click(()=>{
$.post('https://mailthis.to/support#gadget-pro.com', {
Name:$('#Name').val(),
Email:$('#Email').val(),
Phone:$('#Phone').val(),
Device:$('#device').val(),
Repair:$('#repairType').val(),
Price:$('#price').val()
}).then(function (data) {
location.href = 'https://gadget-pro.com/formconfirm'
});
})

I would say to update your code to return back the page. you are likely not triggering the post to page properly or there is an error.
alos console.log the post data before to know what is being sent.
update your code to
console.log(data);
$.post('URL', {data}).then(function (retpage) {console.log(retpage)});

What is state Id that xtext uses while saving the resource

I am hosting xtext's orion editor using iframe in my angular application. I need to save the content written from my angular application side to a backend (Java application). Can anyone help me with what API calls or approach should I make from my angular side so that I can save the content written in the editor.
What I have already done :
1 .I tried extracting the content from the iframe from my angular side , but the data so extracted is partial as it only extracts data what is only visible through the iframe at once and not the whole content which one has to scroll to view .
2 . I tried making 'save' API calls that the xtext makes while saving, but it requires some stateId as its request body . I need to understand what is this state Id and how is it evaluated ?
I am making this call from my angular application
_this.saveEditor = function(args) {
var params = {
requiredStateId: args.stateId
}
_this.saveUrl = XTEXT_URL + '/save?resource=' + args.resourceId;
return $http({
method: 'POST',
url: _this.saveUrl,
data: params
});
};
my request body is :
{"requiredStateId":"-80000000"}
And this is the state Id i am obtaining by making a prior load api call which.returns state Id in its response.

may this snipped can help you, i dont know how you can wire this up with your stuff though
require(["orion/code_edit/built-codeEdit-amd"], function() {
require(["xtext/xtext-orion"], function(xtext) {
var editors = xtext.createEditor({
baseUrl: baseUrl,
syntaxDefinition: "xtext-resources/generated/mydsl-syntax"
}).done(function(editorViewer) {
$("#save-button").click(function() {
editorViewer.xtextServices.saveResource();
});
$("#log-button").click(function() {
console.log(editorViewer.xtextServices.editorContext.getServerState());
});
});
});
});
where i do the simple log you can query and then call save manually.

How load dynamic and well separeted part of views with callback

I have an architectural problem that I can't find an angular-oriented solution. My application has several objects that interact through modals.
For Example:
I can create a new color from functionality of colors management. My creation works through a modal, and in this case the modal will refresh the list of colors behind it.
But when I create a new product I also can create color through this SAME modal. In this case, the modal will refresh my product screen.
With the url and using ajax I can append this modals in html and work with any modal that my system provides in anywhere.
I want to give a different callback for each kind of caller, if possible through the digest cycle of the angular caller scope. But I want to keep my modal independent of the caller.
Note: I don't know the modals that my functionality will need on load, i just know it when the user interacts with the links.
Could I do something like this with angular ?
Here some example:
$(function() {
$('.js-content-link').click(function() {
//here normally is a ajax request with parameters
var url = $(this).data('file');
$.get(url, function(data) {
$('#main-content').html(data);
$('.js-modal-link').click(onClickModalLink);
});
});
var loadModal = function(html) {
$('#modal-content').html(html);
$('.js-modal-link').click(onClickModalLink);
};
var onClickModalLink = function() {
//here normally is a ajax request with parameters
$.get($(this).data('file'), loadModal);
};
})
Plnkr link:
https://plnkr.co/edit/rJdfGC?p=preview

Angularjs - $location.path / $location.url changes URL but doesn't refresh page

Working with Angular and im running into a few issues using $location.url & $location.path
The URL changes at the top of the page to /users/sign_in but I don't see the view until I manually refresh the page, then it appears?
function error(response) {
if (response.status == 401) {
$rootScope.$broadcast('event:unauthorized');
$location.url('/users/sign_in');
};
};
I am not getting any errors.

You're doing a bit too much in your function. You're attempting to change the URL but also return a response. You can try using a $scope.$apply() right after the $location.url call, however you should consider splitting this logic so that the redirect occurs based on the returned response, or don't return any response from the error function.

How to load data prior to page display in AngularJS and Restangular?

I have been using AngularJs with Restangular with PHP backend.
I am calling a function based on route (detail/list) to fetch into variable from Restangular.
The problem is if there is a delay in database connection the page is displayed blank and after a few(2-3) seconds the data is filled and shown,
The issue repeats when navigating to details and going back to the list page.

Here is an example how you can resolve your data before the page is rendered (w/o blank screen):
The 'resolve' function is called before the view is rendered.
$routeProvider.when('/admin/task/:id' , {
templateUrl: '/app/task/admin-task-results.tpl.html',
controller:'AdminTaskDetailsCtrl',
resolve: {
task: function($route, Restangular) {
return Restangular.one('tasks', $route.current.params.id).get();
}
}
});
Just pass the resolved object (task in this example) as argument into your controller:
module.controller('AdminTaskDetailsCtrl', function ($scope, task) { ... });
However, let me point out that this approach is not always the best solution, because the user does not get immediate feedback after changing the route. Consider loading your data in the controller and display a spinner until the data arrived.

I assume that you still need to wait for data loaded, so to draw view without the data and load date later you can use next in the controller constructor:
$scope.$on('$viewContentLoaded', function(){
// Load data into model here
});