Widget image instead of button and status upload widget

Post any questions you have about using the Verj.io Studio, including client and server-side programming with Javascript or FPL, and integration with databases, web services etc.

Moderators: Jon, Steve, Ian, Dave

fronsky
Ebase User
Posts: 86
Joined: Thu Mar 08, 2018 2:52 pm

Widget image instead of button and status upload widget

#1

Postby fronsky » Wed Aug 21, 2019 11:42 am

The PopupConformation comes with a button. Is it possible to use an image instead?

What are the plans for an 'Upload file' widget?
I've seen more interest for this on the forum.
0 x

Steve
Moderator
Moderator
Posts: 414
Joined: Fri Sep 07, 2007 3:44 pm
Location: Sandy, UK
Contact:

Re: Widget image instead of button and status upload widget

#2

Postby Steve » Tue Aug 27, 2019 10:38 am

Hi Fronsky,

We are going to add a new control for file upload that integrates the JQuery FileUpload. The reason for this is because we need to integrate the Servlet with our own server logic for session variables such as file locations etc...

You can integrate this without the extra logic, but you would need to create your own Java servlet to accept the file upload. They have an example servlet as a template to start.

In reply to the Popup Confirmation ... the widget is a button. The widget uses Sweet Alerts, so there are two things your can do here.

1) Restyle the button to use a background image. Help is here

2) This is probably the easiest thing to do:

Add the Web Resource to the form properties:

Code: Select all

https://unpkg.com/sweetalert/dist/sweetalert.min.js
Add a new image control to the page

Edit the HTML element properties and add an onClick event (You'll also need a class identifier or ID)

Add the onClick event code:

Code: Select all

var ctl = com.ebasetech.clientapi.srcControl;

// Display the initial popup - texts are configured in the config function of server-side configure script
swal({
  title: "Confirmation",
  text: "Do you want to delete?",
  icon: "",
  buttons: ["Cancel", "Confirm"],
  closeOnClickOutside: false,
  closeOnEsc: false
})
.then(function(result) {
	try {
		com.ebasetech.clientapi.srcControl = ctl;
 		if (result) {
 			// User has clicked the OK/confirm button.
 			// Call the confirm function of the configure script on the server to take whatever action is necessary.
 			// Optionally this may return an object containing parameters for a second confirmation popup. 
 			var success = $eb.executeFunction('confirm', null, true, false, null, null);
			
			// If the function has returned parameters for a confirmation popup, show the popup 
			if (success) {
				swal({
				 title:success.title,
				 text: success.text,
				 icon: success.icon,
				 closeOnClickOutside: false,
				 closeOnEsc: false
				});
			}
 		}
	}
	finally {
	  com.ebasetech.clientapi.srcControl = null;
	}
});

// Stop the button click calling the server
return false;
I hope this helps

Steve
1 x


Who is online

Users browsing this forum: No registered users and 4 guests