Help get this topic noticed by sharing it on Twitter, Facebook, or email.

How to write business rule for image/picture/blob check controls before saving image?

I have a wizard and in one step I need to upload a photo. I have used tutorial for blob file system adapter (only using virtual fields for File, FileName, ContentType and Length because I don't need this data in database table).

After setting "Changing of the field value causes "Calculate" command to execute" for File field and creating business rule for Custom, Execute I am able to enter this method after choosing picture. BUT - in instance model there are no values for File, FileName, ContentType and Length.

How can I get these values to be able to make some checks on image (size, height, width, etc.)? Is it possible via c# business rule?

Thanks in advance!
1 person has
this question
+1
Reply
  • (some HTML allowed)
    How does this make you feel?
    Add Image
    I'm

    e.g. kidding, amused, unsure, silly indifferent, undecided, unconcerned sad, anxious, confused, frustrated happy, confident, thankful, excited

  • Hi Uremovic, i store the values in my table but as long as you have the calculated values available at the time of doing the checking I would think you would be able to get this to work. I will post the code I am using when I get home In about 12 hours. You should be able to adapt it for your scenario. The code will be in VB. I check for file size and stop the image from being saved and display a message to the user. The more I think about it it might be JavaScript I am running , will know when I get home
  • (some HTML allowed)
    How does this make you feel?
    Add Image
    I'm

    e.g. kidding, amused, unsure, silly indifferent, undecided, unconcerned sad, anxious, confused, frustrated happy, confident, thankful, excited

  • sdms, please post the code. Although, checking size in javascript shouldn't be the problem because we have Length property. What about size (height, width)?
  • (some HTML allowed)
    How does this make you feel?
    Add Image
    I'm

    e.g. kidding, amused, unsure, silly indifferent, undecided, unconcerned sad, anxious, confused, frustrated happy, confident, thankful, excited

  • I definitely realise that FileName, ContentType and Length could not be virtual fields and that have to be stored in database table. This way I have data in tables that take storage place with no reason (because I don't use blob later in grids and editForms) but ok. I can live with it.

    But, I still don't know how to make certain checks on blobs (in this case images) before rest of the data is entered. COT have only scenario where blob is handled after rest of data is entered in tables. And what if I don't want to insert data in table if something is not ok with the blob?
  • (some HTML allowed)
    How does this make you feel?
    Add Image
    I'm

    e.g. kidding, amused, unsure, silly indifferent, undecided, unconcerned sad, anxious, confused, frustrated happy, confident, thankful, excited

  • Anybody solved this?
    How to check width and height of the image (blob)? With Javascript/Jquery or code (C#)?
  • (some HTML allowed)
    How does this make you feel?
    Add Image
    I'm

    e.g. kidding, amused, unsure, silly indifferent, undecided, unconcerned sad, anxious, confused, frustrated happy, confident, thankful, excited

  • Hi Uremovic, apology I meant to get back to you on this. I don't actually check the width or height of my image just the size of the image. On my controller which has the picture in it I created a business rule with Command Name: Insert|Update, Type: JavaScript, Phase: Execute.
    I also have information in the "Footer text" of my image field which informs my users how they can resize their picture which is what the below message in my code is referring to. You can customise the below image size and message to meet your own requirements.
    Hope this helps.

    var fieldValue = [PictureLength];
    if (fieldValue > 25000) {
    // prevent the default action processing
    this.preventDefault();
    // popup alert
    alert('Your picture is too big. It must be less than 25000 bytes (25kb). Please refer to the information displayed below "Picture Size (KB)" which will assist you in how to resize your picture.');
    }
  • (some HTML allowed)
    How does this make you feel?
    Add Image
    I'm

    e.g. kidding, amused, unsure, silly indifferent, undecided, unconcerned sad, anxious, confused, frustrated happy, confident, thankful, excited

  • Thank you sdms, but this doesn't work for me. I don't know why. Beside, I need to check height and width too, so this could help just in one piece of the problem. Thanks anyway.
  • (some HTML allowed)
    How does this make you feel?
    Add Image
    I'm

    e.g. kidding, amused, unsure, silly indifferent, undecided, unconcerned sad, anxious, confused, frustrated happy, confident, thankful, excited

  • 1
    Together with COT, here is one possible solution:

    First, create Javascript, before, Insert rule, script:
    myApp.validateImage(this, 'Photo', 307200, 827, 1064)

    Then, create your custom js file in "js" folder, e.g. Custom.js. In that file, create following method (validateImage):


    (function () {
    window.myApp = {
    validateImage: function (rules, fieldName, maxSize, maxWidth, maxHeight) {
    var dataView = rules.dataView();
    dataView._pendingUploads.forEach(function (file) {
    if (file.fieldName === fieldName) {
    var blob = file.files[0];
    if (!blob.type.match(/^image\//) || !blob.type.includes('jpeg')) {
    $app.alert('File is not an image or is not in correct format (jpg).'); // $app.alert to display a popup
    rules.preventDefault();
    }
    else if (blob.size === 0) {
    $app.alert('Image should not be empty file.'); // $app.alert to display a popup
    rules.preventDefault();
    }
    else {
    // check the file size
    if (blob.size > maxSize) {
    $app.alert('Image is too big. Max size (bytes) is: ' + maxSize); // $app.alert to display a popup
    rules.preventDefault();
    }
    else {
    var img = $('.ui-page-active [data-input-container][data-state="write"] [data-field="' + fieldName + '"] .app-drop-box img');
    if (img.length) {
    if (img[0].naturalWidth > maxWidth) {
    $app.alert('Image width is not correct. Max width is: ' + maxWidth);
    rules.preventDefault();
    }
    else if (img[0].naturalHeight > maxHeight) {
    $app.alert('Image height is not correct. Max height is: ' + maxHeight);
    rules.preventDefault();
    }
    }
    }
    }
    }
    });
    }
    };

    })();
  • (some HTML allowed)
    How does this make you feel?
    Add Image
    I'm

    e.g. kidding, amused, unsure, silly indifferent, undecided, unconcerned sad, anxious, confused, frustrated happy, confident, thankful, excited