call function with parameters and return value on button press - reactjs

I have created a function that sends a request to my nodejs server and takes some parameters (username password etc.) and returns the response status. I would like to have a button activate the function and use text from text boxes to put in the parameters and change the behavior of my app based on the return value of the function. When I do something like this for instance
<Button
title="send"
onPress={console.log(sendCreateUser("testabsdf", "test", "test", "password"))}
/>;
The function opens the second the page is loaded, not when the button is pressed, and it always prints undefined, even though if instead of returning the response.status I use console.log it will work perfectly. I just want to give the user an error message if I don't get the status 201, and I want to take user input and include it in my fetch-post to my server after a button press

Usually onPress function needs to be a callback :
onPress={()=>sendCreateUser('testabsdf','test','test','password')}

Related

MS Access - SubForm field pass through

I have a Navigation Form in which the first button is defaulted to show a blank form (Request form) where users will enter information.
There's an option on this Request form that if there are multiple requests under this request, `a box is checked and another form opens and the request number from the Request form is defaulted into the multiple request form's request number field (this is the link).
On the Multiple Request window's ID field in Property Sheet/Data/Default Value I have =[Forms]![frmRequests]![RequestID]
With the Request form open on its own, this works great, but within the Navigation form it doesn't. Is there another layer that I need to add so the default value works in either format? I will be using it in the Navigation form primarily.
The following worked for me.
=Forms!NavigationFormName.NavigationSubformName.Form!RequestID

AngularJs $http get not working 1st time but does on subsequent invocations

All:
I have an Iframe tag on a simple HTML page and inside this Iframe tag is a HTML form - lets call it a widget. Its a form where the user can enter search criteria and click on a button to obtain the search results. I have decided to use Angularjs to make the necessary DB calls to a REST service that returns the search results back to the widget for display.
In testing this I enter a value in a textbox on the widget, that value being a value that I know exists in a particular table I'm testing against.
Here is my $http get call:
$http
.get('http://localhost/XXXXService/folder/getfolders/' +
$scope.formData.srchterm **==>** mapped to search textbox
).then(function successCallback(response) {
// this callback will be called asynchronously
// when the response is available
//$scope.formData = response;
//$scope.nrdFolderDataArray = response;
console.log('Success retrieving data.');
console.log(response.length);
console.log('response:');
console.log(response);
}, function errorCallback(response) {
// called asynchronously if an error occurs
// or server returns response with an error status.
console.log('Error occurred retrieving data.');
console.log(response.status);
console.log('returned data count:');
console.log(response.size);
console.log('response:');
console.log(response);
});
This call is inside a function called "submitForm" that is mapped to the widget with a "ng-submit="submitForm()" attribute on the submit button. And yes there are several log statements so I can try and figure out what is going on here. And what is happening is this: after entering a value in the textbox, THE FIRST TIME the search button is clicked the .get command does not work. I does not make the call to the REST service. I know this because I wrote the REST service and made sure I put in plenty of log statements while doing so and there are no log statements in the log file from the REST service. Instead the errorCallback block runs and I see all those log statements in the console. The "response" (object?) after THE FIRST call looks like this:
Object {data: null, status: 0, config: Object, statusText: ""} Method = GET Status = (canceled) type xhr
Further, in FF there is no response data to view in the Net tab of Firebug upon THE FIRST call, but there is response data to view in all subsequent calls.
So, interestingly enough each subsequent invocation of that $http.get call works! I see log statements in the log file from the REST service method and the successCallback block runs and I can see my data via those console.log messages.
Also, if I were to change the search value in the text box, which would then be THE FIRST TIME we would be searching for data for that new key, once again, the call does not work, but does work on subsequent clicks on the "search" button for that new key value.
I really am not sure if I have a CORS issue here since, other than THE FIRST calls each subsequent $http.get call works like a champ. Its just that very first call or first call after the search key has changed that the $http.get does not want to work.
I have tried setting headers in the .get call and I have tried using
#CrossOrigin(origins = "http://localhost/7001") as per
https://spring.io/guides/gs/rest-service-cors/ but I continue to have this issue on the first time invoking this .get call.
I've been dealing with this issue for way too many hours now and would sure appreciate some input as to why this is happening.
I'm sorry for being verbose here. I wanted to explain my issue thoroughly.
Please help.
Thank you
-g

How to Post Data before Pop-Up?

I have an application where the user can edit content, then preview that content. Before preview, I need to have the content saved ($http.post to the server). I'm using angular and because the save routine is run through a different controller the code to save looks like:
$scope.$broadcast('save');
var saveCompletedListener = $scope.$on('saveCompleted', function () {
// this call doesn't work (because it waits for data save):
window.open($scope.contentUrl);
});
// this call does work, but shows old data in the popup:
window.open($scope.contentUrl);
The problem is the window.open call is getting blocked in all browsers. If I just call the window.open without waiting for save, it opens fine (it just shows the content from the previous save). So, is there some way in angular to show the popup, but have it wait to load the url until save has completed?

Fine-Uploader How to capture additional params for each file while still allowing multiple files

I have the requirement to allow a user to select a file to upload and then need to capture additional required information from the user that applies to that specific file that will be sent as params to the server when uploading.
Thus far, I have been doing this by working off of the fine-uploader onSubmit callback and displaying a modal with the inputs I need. If inputs pass validation, I store the file id and associated params, otherwise, if they close/cancel the modal I call the fine-uploader cancel api and cancel the file with the given id.
The user can do this multiple times, which queues the files into the standard fine-uploader list and then they would press "Upload" to actually start the uploads concurrently.
All of this works great, my problem is that because I have the "multiple" option enabled, the user can select or drag multiple files at the same time, but I need to present the modal to each of them individually. The onSubmit event is firing individually for each of the files so how can I prevent the second, third, etc, modal from opening until I either cancel or save the previous one?
For the record I am actually using Backbone/Marionette and triggering a "file:added" event for each onSubmit callback. This is where I am creating the modal view and displaying it, however, the solution doesn't need to be tied to backbone.
Also, if there is a better way to collect parameters for a file using fine-uploader, I am not necessarily tied to this approach - just need to make sure that each file has the additional data populated otherwise it can not be uploaded.
Here is the Fine Uploader onSubmit callback:
.on('submit', function(event, id, name) {
var args = {};
args.id = id;
args.fileName = name;
uploadDocsVent.trigger('file:added', args);
})
Here is my code that is listening for that event, creating a File Backbone model, and instantiating a view to be displayed in a Modal region.
uploadDocsVent.on("file:added", function(args){
var file = new UploadDocuments.File( args );
var addlInfoView = new UploadDocuments.Views.FileInfo({
model: file,
categories: App.uploadedFilesCategories
});
App.appLayout.modalConfirmRegion.show(addlInfoView);
});
In my view I have this code responding to the modal clicks:
onDialogPrimaryClicked: function () {
UploadDocuments.claimsUploadWidget.addFileWithInfo( this.model );
this.trigger("dialog:close");
},
onDialogSecondaryClicked: function () {
UploadDocuments.uploadView.uploader.fineUploader('cancel', this.model.get('id'));
this.trigger("dialog:close");
}
Thanks in advance for any ideas on how to approach/get around this.
Andrew - I think I know what you are getting at. It's clear that you simply want Fine Uploader to only process a file in a batch of selected files after the user has submitted information in the modal that your display for that file in your onSubmit handler. What you are looking for is a way to return a promise, or a "deferred" in your onSubmit handler. This would allow you to call Fine Uploader back (and say "go ahead, upload/submit this file and move on to the next") once your user has submitted the associated modal.
I have already created a qq.Promise "class" that implements the promise pattern. Fine Uploader observes a promise as a valid return value only for the onPasteReceived callback at this time. It might make sense to allow this as a valid return value for other callbacks, such as onSubmit. This would allow you to defer uploading/submittal of a file until the user has dealt with the associated modal. Setting the multiple option to "false" may or may not be a desirable option for you now, due to the way Fine Uploader functions in "single-file mode".
I think it may be valuable to allow promises to be returned in some callbacks, such as this one, to allow for user interaction. Could you please open up a feature request in the Github project? There, we can discuss a bit more and you can track progress on any associated changes I put into the library.

How to insert function() into $form->js()->submit()?

I want to execute function on Form submit, but I when i use $form->js('submit,array('function())` it works only when I click submit button, but doesn't work on Enter.
Is there a way to insert code in jquery function from php side of at4 like $this-js()->submit('function(){alert('sth')})
For those who will have the same problem. In atk4 when you press eneter in one of forms fields it calls atk4 function submitForm() without calling form.submit(). That is why binding something to form.submit() doesn't work with enter press. It can be solved by adding
$form->js(true)->find('input')->keypress("function(e) {
if ($(this).is('.ui-autocomplete-input')) return true;
if (e.keyCode==13) {
$(this).trigger('change');
".$this->owner->js()->submit()."
ev.stopImmediatePropagation();
});
and when you want to bind something with form submit, add:
$form->js(true)->submit($form->js(false,"function(ev){}));`

Resources