0

MultiLine Text field with multiple rows alongside in form

Hi,

I'm not sure if this has been asked before, but could not find it when searching. Apologies if it has been posted.

I am looking at Ninox to migrate date from another database platform, so still at the early stages of getting to grips with it.

One thing I would like on the form is to be able to have a large text box occupying 2 columns and then have two columns of other fields along side it. As the text box will be several rows 'high' I would like to have multiple rows alongside it. For instance in the 'Real Estate' template, the 'Property' form has a large image of the property and then four rows of fields running along side it. This is just what I want but with a multi-line text field. I have tried to do this, but can only get one row of fields.

Is there a way to do this, or is it a limitation of Ninox? I would have thought fields could be placed anywhere on the form - years ago I used Access and this allowed you to do this.

Thanks for any help given.

Mark.

27replies Oldest first
  • Oldest first
  • Newest first
  • Active threads
  • Popular
    • Mconneen
    • Mconneen
    • 3 yrs ago
    • Reported - view

    At least on the Mac App.. I have had the same experience.  I can float fields next to an image filed.. but not next to a multi-line text field. :( 

    Like
  • Hi, 

    We have already planned to improve that behaviour and to make it possible to place multiple fields alongside other fields that are higher. We hope to release that improvement in one of our upcoming versions.

    Thanks for your patience.

    Kind regards, Jörg

    Like
    • Bernd Krell
    • NetSol Co., Ltd.
    • Bernd_Krell
    • 3 mths ago
    • Reported - view

    Where are we with this after 3 years? Jörg

    Like
  • NOWHERE ! - To date this is still not implemented. Only works if text/data fields are placed after the image field and even then there are limitations..... Drives me mad as this wastes a lot of screen/form space that could be used.

    Even better if Ninox changed the field grid locking to allow closer placement or dare I ask freeform placement of fields in design mode!

    Like 1
      • Alan Cooke
      • Alan_Cooke.1
      • 3 mths ago
      • Reported - view

      Mel Charles And size both vertically and horizontally to a size that matches the smallest size in 'style' property.

      Like
    • Bernd Krell
    • NetSol Co., Ltd.
    • Bernd_Krell
    • 3 mths ago
    • Reported - view

    One thing I realize since I started with Ninox late last year is that not a single of the many bugs I reported to them, has been addressed. This is very disappointing.
    And going through this forum I find many requests which have been promised to be address, years ago. But till today, nothing. Since I build a database for our entire company, this bugs me a lot. And worries me even more.

    Like 2
  • Hello everyone, I found a simple workaround to align a field on the left or right. You just have to put this code in a formula on the window :

    var options := {
            fieldName: "myText",
            align: "left"
        };
    html(---
    <script>
    ui.getCurrentEditor().currentTab.components.find( e => e.field.caption == '{ options.fieldName }' ).el[0].style.float='{ options.align }';
    </script>
    ---)
    

    See the description of the float property here : https://developer.mozilla.org/fr/docs/Web/CSS/float

    Like 5
      • Sam
      • Sam.1
      • 3 mths ago
      • Reported - view

      Jacques TUR hello and thank you for the code! 

      Like
    • Fred
    • Fred
    • 3 mths ago
    • Reported - view

    Awesome Jacques TUR ! You are the best!

    Table2 is a reference field that I used to float. Then the fields Formula and Formula 2 now float on the right side.

    Just to be clear, you take Jacques code below and add it to a formula field. You will need to add this code for each form/tab you make that you need to float. 

    You can hide the formula field by putting it at the end of your form, removing the the field name, and making it the same color as your background.

    Or you can add it as part of another formula field that exists on the Form/tab.

    Like 1
    • Fred thank you for these very useful details 👍

      Like
      • Rafael
      • Rafael Sanchis
      • Rafael_Sanchis
      • 3 mths ago
      • Reported - view

      Jacques TUR Fabulous Jac, Thanks

      Like
      • Sam
      • Sam.1
      • 3 mths ago
      • Reported - view

      Fred Hi Fred, 

       Could you please show the corresponding codes for each formula field that you floated ?

      thanks

      Like
  • ***** FANTASTIC - AWSOME - BRILLIANT  *****

    You just solved something that has got on my nerves for last couple of years.

    Shame that the Ninox team could not do this tho !!!! 
    Jaques - You just have to get a job a Ninox as Mr Fix it mate :-)

    Like 1
    • Fred
    • Fred
    • 3 mths ago
    • Reported - view
    Sam said:
     Could you please show the corresponding codes for each formula field that you floated ?
    thanks

    Ask and you shall receive!

    Here is what the code looks like as part of a formula field that does double duty:

    var options1 := {
            fieldName: "CurrentLogo",
            align: "left"
        };
    html(---
    <script>
    ui.getCurrentEditor().currentTab.components.find( e => e.field.caption == '{ options1.fieldName }' ).el[0].style.float='{ options1.align }';
    </script>
    ---);
    last(SeasonsActive.Seasons.Year)
    

    I found out that you need to put the align code before any other code.

    Jacques made the code very easy to use as all you have to change is the text next to fieldname in Line 2 and, if you want, the text next to align in Line 3. Then put a semicolon ( ; ) at the end and then add your own code.

    I also played around with trying to affect multiple fields. The following code is in a field called Formula 5:

    var options2 := {
            fieldName: "Logo",
            align: "left"
        };
    var options3 := {
            fieldName: "SeasonsActive",
            align: "right"
        };
    html(---
    <script>
    ui.getCurrentEditor().currentTab.components.find( e => e.field.caption == '{ options2.fieldName }' ).el[0].style.float='{ options2.align }';
    ui.getCurrentEditor().currentTab.components.find( e => e.field.caption == '{ options3.fieldName }' ).el[0].style.float='{ options3.align }';
    </script>
    ---)
    

    As you can see, I have two fields I want to align (Logo and SeasonsActive). Here is what is looks like:

    Still figuring out how to make it work but as you can see the two fields are now aligned left and right.

    Like 1
    • Bernd Krell
    • NetSol Co., Ltd.
    • Bernd_Krell
    • 3 mths ago
    • Reported - view

    I can't get that working.
    I added a Formula field with the code provided. But still I can't have more than one field next to "Notes". Am I missing something?

    Like
    • Bernd Krell Is the field called "Notes" or Note" ? Maybe that's the reason?

      Like
    • Bernd Krell Please let me see your code to help you.

      Like
    • Bernd Krell
    • NetSol Co., Ltd.
    • Bernd_Krell
    • 3 mths ago
    • Reported - view

    Thanks everyone, here is the code I am using.

    var options1 := {
            fieldName: "Note",
            align: "left"
        };
    var options2 := {
            fieldName: "Role",
            align: "right"
        };
    var options3 := {
            fieldName: "Email",
            align: "right"
        };
    var options4 := {
            fieldName: "Phone",
            align: "right"
        };
    var options5 := {
            fieldName: "Name",
            align: "right"
        };
    html(---
    <script>
    ui.getCurrentEditor().currentTab.components.find( e => e.field.caption == '{ options1.fieldName }' ).el[0].style.float='{ options1.align }';
    ui.getCurrentEditor().currentTab.components.find( e => e.field.caption == '{ options2.fieldName }' ).el[0].style.float='{ options2.align }';
    ui.getCurrentEditor().currentTab.components.find( e => e.field.caption == '{ options3.fieldName }' ).el[0].style.float='{ options3.align }';
    ui.getCurrentEditor().currentTab.components.find( e => e.field.caption == '{ options4.fieldName }' ).el[0].style.float='{ options4.align }';
    ui.getCurrentEditor().currentTab.components.find( e => e.field.caption == '{ options5.fieldName }' ).el[0].style.float='{ options5.align }';
    </script>
    ---)

     

    Like
      • Rafael
      • Rafael Sanchis
      • Rafael_Sanchis
      • 3 mths ago
      • Reported - view

      Bernd Krell Hi Bernd your Code Works fine

      Like
    • Bernd Krell
    • NetSol Co., Ltd.
    • Bernd_Krell
    • 3 mths ago
    • Reported - view

    Rafael That's good new, thx. But it leaves me with the question why it doesn't work for me.
    The field between "Phone" and "Role" is my formula field which includes the code I posted above. Yet nothing changes on my layout. I am working on the Ninox iPad app but also test it on Windows from various browsers with the same result.
     

    Like
      • Rafael
      • Rafael Sanchis
      • Rafael_Sanchis
      • 3 mths ago
      • Reported - view

      Bernd Krell Hi again I saw is a sample DB you can Share?

      Like
    • Bernd Krell At home, it works well.Can you try with the database as an attachment?

      • Bernd Krell
      • NetSol Co., Ltd.
      • Bernd_Krell
      • 3 mths ago
      • Reported - view

      Jacques TUR That does work fine. Thank you very much. My issue seems to be not the code but the way I choose to get to the record. See my latest reply.

      Like
    • Bernd Krell
    • NetSol Co., Ltd.
    • Bernd_Krell
    • 3 mths ago
    • Reported - view

    Rafael Unfortunately it's a live database, thus can't share.

    But I just found something I think is interesting.

    If I click on the contacts link as shown in the first screenshot, then the contacts page shows the old way. But when I click directly on the subtable and then choose the contact I want to see, it shows the new way / layout.

    Since the destination is the same and only the way I use to access it is different, I wonder why it is not working for both.

    Like
    • Bernd Krell Ok, indeed, when the window is opened in second (popup of the first form), the formula does not work anymore. I found the origin of the problem and I corrected the code:

      var params := {
              id: "myUniquID",
              fields: [{
                      name: "Note",
                      align: "left"
                  }, {
                      name: "Role",
                      align: "right"
                  }, {
                      name: "Email",
                      align: "right"
                  }, {
                      name: "Phone",
                      align: "right"
                  }, {
                      name: "Name",
                      align: "right"
                  }]
          };
      html(---
      <script id='{ params.id }'>
      var components = $(document.querySelectorAll('#{ params.id }')).last().closest('.component').data('component').container.currentTab.components;
      { formatJSON(params.fields) }.forEach( f => components.find( e => e.field.caption == f.name ).el[0].style.float=f.align)
      </script>
      ---)
      

      I took the opportunity to optimize it for use with multiple fields. There are only 2 lines of code, no matter the number of fields to modify.

      In line 2, I added an 'id' in 'params'. It must be unique so that the function can find the right fields on the right window. For example, if you use the function on the Contacts window and the Customers window, you will have to give them a different value (like for example "Contacts" and "Customers").

      If you have only one field, set the params like this : 

      var params := {
              id: "myUniquID",
              fields: [{
                      name: "Note",
                      align: "left"
                  }]
          };
      
      Like 3
Like Follow
  • 2 mths agoLast active
  • 27Replies
  • 1657Views
  • 9 Following