Is there a way to amend the standard layout format in Plumsail Forms, we have previously used Forms Designer and have hundreds of forms set up, on almost all forms we use vertical Orientation for our fields as having the field title above left of the field itself seems to make sense to our users and fits with previous systems they have used.
Looking at making the switch to Plumsail Forms I have recreated a number of forms but found the layout is really quite poor compared to Forms Designer, below is a screenshot of one of our display forms created with Forms Designer, with no real changes apart from changing the orientation and making the title Bold and coloured.
Below is a screenshot taken from a display form created with Plumsail Forms, the spacing on the table is very poor, making it really difficult to tell what data belongs with what title, plus the amount of screen size used for so few fields means we will have very poor UX for large forms with users having to scroll much more than they should, I have even reduced the vertical padding on the fields down to 0, but it has made no real difference...
There simply has to be a way to amend this as without that our client will simply not accept the forms, in the screenshot above why is there such a huge amount of padding between the title and field data?
One more thing, not sure if this is a Plumsail Forms thing or a modern experience thing but I and lots of our regular users are used to tabbing around a form to complete the fields and I generally only really touch the mouse once the form has loaded to save the Form. But it seems that this is not possible on Plumsail Forms tabbing to a Lookup seems to highlight the field but if I then begin to type so as to perform a search on the lookup nothing happens.
I physically have to click the lookup field with my mouse to activate it and then again if I then start to type, as the Lookup filters when the option I want is in the top two or three I would just hit the down arrow and then return when the correct option is highlighted, this seems hit and miss as to if it populates the field at all, and if it does it only ever selects the top option even if I have hit the down arrow 3 times! There is also something not quite right even if the field is populated this way as the validation on the field fails unless it is clicked with a mouse!
Not ideal for user experience, any information would be good on this…
If you are working on Windows, try “Alt + down arrow” to open a lookup dropdown.
Speaking of a selecting value of a drop-down after typing some filtering string, I’ve reproduced this behavior and confirm that the issue exists, need to select a value twice with “Tab” or “Enter” before a field will be populated.
Thank you for letting us know on the issue. I’ve created a bug in our issue tracking system. I’ll keep you informed on its status.
Reading the post's searching for an answer Alex just write about that this problem is fixed.
The question I have is related with the user experience filling data tables.
I have a free version of the platform Desktop Designer V 1.6.0 and I'm working so hard to create my custom form, I read all the support pages looking for and answer but nothing found.
This functionality can be added to Data Table control.
The code below adds the 'Import' button to the toolbar. A user clicks on the 'Import' button and pastes any table data.
Please replace DataTable0 with the internal name of the control.
This code example is for Public Froms. For SharePoint forms replace rendered with spRendered event.
fd.rendered(function() {
var grid = fd.control('DataTable0').widget;
grid.setOptions({toolbar: [
'create',
{
name: 'import',
text: 'Import'
}]
});
$('.k-grid-import').click(function(e){
// get the grid position
var offset = $(this).offset();
// crete a textarea element which will act as a clipboard
var textarea = $('<textarea placeholder="Paste your text here..."></textarea>');
// position the textarea on top of the grid and make it transparent
textarea.css({
position: 'absolute',
top: offset.top,
left: offset.left,
border: '1px solid grey',
width: 200,
height: 100
})
.appendTo('body')
.on('paste', function() {
// handle the paste event
setTimeout(function() {
// the the pasted content
var value = $.trim(textarea.val());
// get the pasted rows - split the text by new line
var rows = value.split('\n');
var data = [];
for (var i = 0; i < rows.length; i++) {
var cells = rows[i].split('\t');
data.push({
Column1: cells[0],
Column2: cells[1],
Column3: cells[2]
});
};
grid.dataSource.data(data);
textarea.remove();
});
})
.on('focusout', function() {
$(this).remove();
});
setTimeout(function() {
textarea.focus();
});
});
});
Hello,
I do find this piece of code fantastic!
One problem: this textarea doesn't show. Do not even throw any error.
I have tried to apply it on Sharepoint on premise.
The code executes. I checked it inserting some console.logs, but it results textarea as undefined.
This solution would be very very nice to have.
Any idea?