File uploads not saving

[FLHRentals]

Hello,

 

I have a single record update data page with multiple input fields including image upload.  If all required fields are properly filled in, image uploads work fine.  However, if a single required field is not filled in, then the image upload fails.  Is there any way to make the image upload work even if the required fields are not properly filled in?  This way a user doesn't have to re-upload several images in order to fix one mistake in a different field.

 

Thanks!

[Mathilda]

13 hours ago, FLHRentals said:

Hello,

 

I have a single record update data page with multiple input fields including image upload.  If all required fields are properly filled in, image uploads work fine.  However, if a single required field is not filled in, then the image upload fails.  Is there any way to make the image upload work even if the required fields are not properly filled in?  This way a user doesn't have to re-upload several images in order to fix one mistake in a different field.

 

Thanks!

Hi, you may add several update buttons to your update form.

You could place a button below the required fields to save entered data. If entered data are not correct, user will see that.  

Paste the code of an update button in an html block:

<input type="submit" onmouseout="cbButtonHover(this,'cbUpdateButton');" onmouseover="cbButtonHover(this,'cbUpdateButton_hover');" class="cbUpdateButton" value="Update" id="Mod0EditRecord" name="Mod0EditRecord">

So you need to place all the fields for images in the end of the form. 

Another option - create a multi-step work-flow.

 

[FLHRentals]

Great idea with having several update buttons and putting the fields for images at the end of the form.  I actually thought of this too but I didn't have the code for creating an additional button, so thanks for that!  The ideal solution is a multi-step workflow and to be perfectly honest this is what I'll do in the end.  For now I'm trying to stay at the $59/month plan until I have proof of concept on my business idea.  I'm already at 5 datapages so I'm trying to squeak by without extra datapages for now.  Thanks again, your advice is much appreciated!

[Vitalikssssss]

Hi everyone,

 

I would like to share an alternative solution for the described issue. 

My solution will validate a required field via custom JS i.o. Caspio standard "required" field check.

Please put following snippet of code into the Footer of your Submission Form.

Make sure that you have disabled the HTML editor before inserted the JS code.

<SCRIPT LANGUAGE="JavaScript">

function check_required()
{
var field1 = document.getElementById("InsertRecord_YOUR_REQUIRED_FIELD#1").value;
var field2 = document.getElementById("InsertRecord_YOUR_REQUIRED_FIELD#2").value;

var emptyFields = false;
if (field1.length < 1) emptyFields = true;
if (field2.length < 1) emptyFields = true;

if (emptyFields)
  {
     
      alert("Required fields are empty.");
      return false;
     }
}
document.getElementById("caspioform").onsubmit=check_required;
</SCRIPT>

 

Hope this helps.

[Kurumi]

Hi - Just wanted to share this solution. If you want to restrict file type in multiple fields, just like in this article: https://howto.caspio.com/tech-tips-and-articles/advanced-customizations/restrict-file-types-that-can-be-uploaded-in-a-datapage/

You can use this code:

<script type="text/javascript">

var files = Array.from(document.querySelectorAll('#InsertRecordFIELDNAME1, #InsertRecordFIELDNAME2, #InsertRecordFIELDNAME3, #InsertRecordFIELDNAME4, #InsertRecordFIELDNAME5'));

var extensions = ['pdf'];

files.forEach(function(el) {
el.addEventListener('change', function(e) {

var ext = this.value.match(/.([^.]+)$/)[1];

if (!extensions.includes(ext)){

alert('Invalid file format. Please upload PDF only.');

this.value = '';

}
});});

</script>

Hope it helps!

[GoodBoy]

On 9/29/2017 at 3:39 AM, Vitalikssssss said:

Hi everyone,

 

I would like to share an alternative solution for the described issue. 

My solution will validate a required field via custom JS i.o. Caspio standard "required" field check.

Please put following snippet of code into the Footer of your Submission Form.

Make sure that you have disabled the HTML editor before inserted the JS code.

<SCRIPT LANGUAGE="JavaScript">

function check_required()
{
var field1 = document.getElementById("InsertRecord_YOUR_REQUIRED_FIELD#1").value;
var field2 = document.getElementById("InsertRecord_YOUR_REQUIRED_FIELD#2").value;

var emptyFields = false;
if (field1.length < 1) emptyFields = true;
if (field2.length < 1) emptyFields = true;

if (emptyFields)
  {
     
      alert("Required fields are empty.");
      return false;
     }
}
document.getElementById("caspioform").onsubmit=check_required;
</SCRIPT>

 

Hope this helps.

Hello! It looks like the open and closed parentheses are missing in the check_required function at the end. It should be check_required().