I'm trying to save a file in a flex web app using filereference's save function, but a dialog box never pops up. I know the docs say it can only be called in reaction to user input, so I put the call to save in the button's click function like so
<mx:Button label="Save" click="clickCallback(event)"/>
and the callback looks like
private function clickCallback(event:MouseEvent):void {
Alert.show("Do save");
mFile.save(mData);
}
The alert shows up, but no dialog box ever shows up.
Related
I have a table in which the last column of each row holds a Button that is intended to trigger a popup to "edit and save" certain values of that row in my React app. Part of the criteria was that clicking outside the popup would also close it while preventing the user from clicking things in the background until the popup closed.
To do this, I opted to use a package called reactjs-popup. Currently for all criteria, it works perfectly. The next step, though, was to run a function when the button is clicked so that I could pull data from the API to populate the fields. However, I found that I couldn't call any functions from the onClick of the button used as a trigger. This is the main snippet of code:
import Popup from 'reactjs-popup' // this is the npm package I used
// more react code, including an arbitrary loadInfo function
<Popup
trigger = {
<Button onClick = {() => { loadInfo() }}
}
modal
nested
>
{ close => (
<div className = "modal1" id = "popupForm">
// popup content with input forms with values to be populated
</div>
}
</Popup>
The main problem I have is the "onClick" part of the Button in the trigger. No matter what I put in there, it is never ran when I click it. When I test the same button as a standalone, and not as the trigger for the popup, it works fine.
I also tried using
onClick = {loadData()}
But this just caused the function to constantly run as soon as it was rendered, and inevitable break due to too many renders. Does anyone know why this reactjs-popup component does not allow onClick within its trigger? And if so, how to get around it? Thanks!
I believe you want to loadInfo when the popup opens.
For that, there is a prop onOpen in Popup which accepts a function . You can use that,
Or you can manually set open prop using state. Have a button outside popup and update the open state when it clicked.
I am attempting to trigger a form submit from an input [type=file] dialog box window. I'm trying to streamline the process of selecting an image and then having to click another button to submit the form to the database.
I have updated the question to include screenshots and code below to hopefully make the issue I'm having more clear.
Note:
It was asked why I don't add an id to the input button, but I can't, as the file input is invoked from the function, and as it's a windows process, I have no ability to add/change it.
Here's some code / pics to better illustrate the issue.
1 - The user clicks the change pic button to update their profile image. This button runs a shortcode [upload-user-profile-avatar].
2 - The shortcode triggers the standard input file open box window.
3 - After the user either double clicks a file, or single clicks a file and presses the open button, the form for the user profile avatar plugin is automatically submitted.
Attempts:
I originally started out using jQuery to attempt to attach to the form and submit it on click,
jQuery('input[type=file]').change(function(){
nameOfForm.submit();
});
However I read in a SO post that someone else was attempting something similar, and jQuery wouldn't submit the form, so they had to switch to javascript, which I did (since jQuery wasn't submitting the form)...and I came up with this for testing purposes.
var form = document.getElementsByClassName("update-user-profile-avatar");
var inputs = document.getElementsByTagName('input');
for(var i = 0; i < inputs.length; i++) {
if(inputs[i].type.toLowerCase() == 'file') {
console.log(inputs[i].value);
form.submit();
}
}
So this was helpful in so much that I could see that the open dialog window is grabbing the correct filename, but still, the form isn't getting submitted and I'm getting a form.submit() is not a function error in the console.
So then I read that html form submissions can have a lot of weirdness about them, so try something along these lines.
jQuery('input[type=file]').change(function(){
for(var i = 0; i < inputs.length; i++) {
if(inputs[i].type.toLowerCase() == 'file') {
console.log(inputs[i].value);
HTMLFormElement.prototype.submit.call(form);
}
}
});
which produced this error:
'submit' called on an object that does not implement interface HTMLFormElement.
So I think I'm spinning my wheels here. I sense this is doable, I'm just not using the right method to do it.
I think you're looking for the change event:
Demo
$('input[type=file]').change(function(){
$('form').submit()
})
Unfortunately for security purposes the browser isn't going to let you access the open window. However with the .change() method, it will trigger whatever function you'd like once the value of the input has changed. Whether they double click a file to select it, or click the file and "open" button.
I am currently trying to build an application using Google App Maker. After a user hits a "Create" button, depending on whether the files were successfully or unsuccessfully sent, a popup snackbar should display saying "File successfully sent" or "Something went wrong. File not sent." I want to indicate to the user in the final deployed application (no bottom console log) whether their files were sent or not. I do not know how to do this. I have tried creating separate pre-created snackbars (one for success, one for failure) and having the clientscript function display either one depending on what is returned from the serverscript function. However, I do not know how to show them. How do you display a snackbar popup in a clientscript function? Thank you for your help!
Please follow below steps in order to display Snackbar page.
Create a Snackbar page in your appmaker. In order to click on Left Hand Side panel '+' button on the "Page" section.
Choose Pop up. Click "Next" button. On the Next page Select "Snackbar" and click on "Create".
This will create a snack bar page for you. Open the snack bar page. On the bottom part you can see a text box which will display your custom message. Bind a Function to it. Show cased below.
Now in the client script add the following code to configure Snackbar.
This will create a Reusable Snack bar for you for all different messages.
//Client Script
var notificationText='';
function setNotificationText(text)
{
notificationText=text;
}
function getNotificationText()
{
return notificationText;
}
Whenever any event happens add the following code to Display Snackbar.
setNotificationText('Congratulations!!! You have successfully showcased SnackBar');
app.popups.Snackbar.visible = true; //Snackbar is page name.
Here configuring Snackbar code is optional, just to reuse one page for many messages. You can directly showcase the Snackbar page by adding app.popups.Snackbar.visible = true; code in your client script.
I have a script I am making that is essentially a form that submits an email. There is a submit and a reset button. My goal I am hoping to accomplish is the the Reset button either reloads the Google Site, or reloads the App Script.
Is there a function in Google Apps Scripts that I can use to accomplish this?
By putting everything in a panel (horizontal, vertical, scroll, etc), you can do the following in your server handler for your form submit
app = UiApp.getActiveApplication().remove(0);
/*add whatever you want here using app */
return app;
This removes the first item in the app (the panel) and lets you add whatever.
You could also use a client handler with an initially invisible item. On submit, hide the form and show a message until the server handler returns.
Unfortunately, there is no way to refresh the page.
Edit: Adding what I wrote in the comment so it's readable:
The way I usually set mine up, doGet and the handler both call another function with arguments for the new/current app and whatever values my listboxes have. For example,
function doGet(e){
return actuallyCreateGadget(UiApp.createApplication(), "default value for listbox");
}
function actuallyCreateGadget(app, selectedValue){
//do stuff here and finish by returning app
}
function serverHandlerFunction(e){
return actuallyCreateGadget(UiApp.getActiveApplication().remove(0), e.parameter.lbFirst);
}
I have a Mobile Project in FB 4.6 with a TabbedViewNavigator. I have 4 buttons at the bottom, which are ViewNavigators, and act as the Tabs. For this instance, lets say the tabs are labeled, HOME, ADD, DELETE, and ABOUT. I am running into the following situation:
User presses the ADD tab.
In the ADD screen, user clicks on several links which takes them away from the ADD tab's firstView and to a new view all together. For this instance, let's say the active view is called PlayersView.
User now clicks another tab, for example HOME.
User decides to go back to the ADD tab. However, upon pressing the ADD tab, the user is taken to the last view, which in this case was the PlayersView.
How can I have the functionality changed so that upon pressing a Tab, the user is ALWAYS taken to the firstView property of that tab. As referenced above, this is not happening. I have tried creating an IndexChangeEvent listener on the tabbedNavigator and then changing the tabbedNavigator's selectedIndex, however this doesn't work.
protected function tabbedviewnavigatorapplication1_applicationCompleteHandler(event:FlexEvent):void {
this.tabbedNavigator.addEventListener(IndexChangeEvent.CHANGE,onIndexChange);
}
protected function onIndexChange(event:IndexChangeEvent):void {
this.tabbedNavigator.selectedIndex = event.newIndex;
trace(' THIS DOESN'T WORK');
}
Any help is appreciated. Thanks, in advance.
In your code, when you set
tabbedNavigator.selectedIndex
you switch between different ViewNavigators, not between different Views inside a ViewNavigator.
As I understand it, you are trying to stay within a single ViewNavigator stack and select the first View.
Let's say you have:
<s:navigators>
<s:ViewNavigator id="addSomethingNavigator" firstView="views.AddView"/>
<s:ViewNavigator id="deleteSomethingNavigator" firstView="views.DeleteView"/>
</s:navigators>
You can pop to a specific ViewNavigator's first View like so:
addSomethingNavigator.popToFirstView();