JavaScript UI Libraries & Blazor Components Suite – Smart UI › Forums › Text Boxes & Inputs › smart-multiline-text-box rows seems not working

Tagged: 

Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • May 14, 2021 at 3:26 pm #101806
    tullio0106
    Member

    I’m trying to use smart-multiline-text-box with the rows parameter, I setted rows to 10 but I still see 5 lines (default).
    What’s wrong ?
    Tks
    Tullio

    <smart-multiline-text-box class="elemento_textarea_valore" placeholder="Insert value" horizontal-scroll-bar-visibility="auto" vertical-scroll-bar-visibility="auto" enter-key-behavior="newLine" rows="10" value="">

    May 17, 2021 at 7:57 am #101807
    yavordashew
    Member

    Hi tullio0106,
    Thank you for contacting us!
    We have tested the Smart-Multiline-Text-Box component and it works as it should.
    Maybe you can share a code example with us that reproduces your issue in order to be able to give a solution for it.
    One thing I strongly advise you is to check if you have included all the necessary scripts and styles for the component.
    Please, do not hesitate to contact us if you have any additional questions.
    Best regards,
    Yavor Dashev
    Smart UI Team
    https://www.htmlelements.com/

    May 17, 2021 at 2:27 pm #101812
    tullio0106
    Member

    Hi
    I wasn’t able to reproduce my situation in a simple way.
    However using the Firefox development tools I found the problems seems in a “height : auto”  coming from smart.default.css line 38 : switching off that value from firefox development tools I get the required result.
    Tks
    Tullio
     

    May 18, 2021 at 2:02 pm #101816
    yavordashew
    Member

    Hi tullio0106,
    Thank you for contacting us!
    I have tested the smart-multiline-text-box component in Firefox as well but still I was unable to reproduce the issue that you do.
    However when you disable the ‘height: auto’ styles the component has more than 10 rows which I think is not the functionality you want to achieve.
    If we are to be able to give you proper support it will be best to share a code example of your case because this behavior could be coming not from the component itself.
    Please, do not hesitate to contact us if you have any additional questions.
    Best regards,
    Yavor Dashev
    Smart UI Team
    https://www.htmlelements.com/

    May 18, 2021 at 2:32 pm #101817
    tullio0106
    Member

    Tks for your help.
    I’m not able to reproduce the proble in a simple environment.
    However I noticed something strange.
    Looging at the “real html” from firefox development tools I saw the <textarea> tag has a rows = 4
    Changing it to 10 I get the required result, but I don’t know how this textarea tag is generated.
    Tks
     

    May 24, 2021 at 1:37 pm #101834
    tullio0106
    Member

    Could You suggest a solution for mt problem ?
    Tks

    May 24, 2021 at 2:41 pm #101837
    admin
    Keymaster

    Hi tullio0106,
    We are unable to reproduce an erroneous behavior with this component.
    Best regards,
    Peter Stoev
    Smart UI Team
    https://www.htmlelements.com/

    September 22, 2021 at 10:39 am #102278
    tullio0106
    Member

    Hi
    I retried, after version change, to see if the textarea height problem was resolved but still, using
     
    <smart-multiline-text-box id=”e497880705″ class=”elemento_textarea_valore” placeholder=”Insert value” horizontal-scroll-bar-visibility=”auto” vertical-scroll-bar-visibility=”auto” enter-key-behavior=”newLine” rows=”2″ value=”” name=”e497880705″></smart-multiline-text-box>
    it show large more or less 4 lines.
    Looking to the generated textarea tag with the inspector it allways have rows=”4″.
     
    Tks

    September 22, 2021 at 12:35 pm #102280
    tullio0106
    Member

    Here the expanded HTML code
    <smart-multiline-text-box id=”e1205162406″ class=”elemento_textarea_valore smart-element smart-multiline-text-box smart-drop-down-box” placeholder=”Insert value” horizontal-scroll-bar-visibility=”auto” vertical-scroll-bar-visibility=”auto” enter-key-behavior=”newLine” rows=”2″ value=”” name=”e1205162406″ drop-down-button-position=”right” drop-down-open-mode=”default” type=”textarea” role=”textbox” aria-multiline=”true” aria-describedby=”e1205162406Hint” aria-labelledby=”e1205162406Label”><div role=”presentation” smart-id=”container” class=”smart-container”>
    <span class=”smart-label” smart-id=”label” id=”e1205162406Label”></span>
    <div class=”smart-inner-container” role=”presentation” smart-id=”innerContainer”>
    <textarea class=”smart-input” autocapitalize=”none” autocomplete=”off” cols=”20″ minlength=”0″ name=”e1205162406″ placeholder=”Insert value” rows=”4″ aria-label=”Insert value” smart-id=”input” id=”e1205162406Input” wrap=”soft”></textarea>
    <smart-scroll-bar theme=”” animation=”advanced” orientation=”vertical” smart-id=”verticalScrollBar” class=”smart-element smart-scroll-bar” show-buttons=”” id=”scrollBar834c” role=”scrollbar” aria-orientation=”vertical” aria-valuemin=”0″ aria-valuemax=”1000″ aria-valuenow=”0″ aria-controls=”e1205162406Input”><div class=”smart-container” role=”presentation” smart-id=”container”>
    <div class=”smart-scroll-button smart-arrow-up” role=”presentation” aria-hidden=”true” smart-id=”nearButton”></div>
    <div class=”smart-track” role=”presentation” smart-id=”track”>
    <div class=”smart-thumb” role=”presentation” smart-id=”thumb” style=”height: 39.0181px; top: 0px;”></div>
    </div>
    <div class=”smart-scroll-button smart-arrow-down” role=”presentation” aria-hidden=”true” smart-id=”farButton”></div>
    </div></smart-scroll-bar>
    <smart-scroll-bar theme=”” animation=”advanced” smart-id=”horizontalScrollBar” class=”smart-element smart-scroll-bar” show-buttons=”” id=”scrollBar43ec” role=”scrollbar” aria-orientation=”horizontal” aria-valuemin=”0″ aria-valuemax=”1000″ aria-valuenow=”0″ aria-controls=”e1205162406Input”><div class=”smart-container” role=”presentation” smart-id=”container”>
    <div class=”smart-scroll-button smart-arrow-left” role=”presentation” aria-hidden=”true” smart-id=”nearButton”></div>
    <div class=”smart-track” role=”presentation” smart-id=”track”>
    <div class=”smart-thumb” role=”presentation” smart-id=”thumb” style=”width: 39.0181px; left: 0px;”></div>
    </div>
    <div class=”smart-scroll-button smart-arrow-right” role=”presentation” aria-hidden=”true” smart-id=”farButton”></div>
    </div></smart-scroll-bar>
    <div class=”smart-resize-element” aria-label=”Resize” smart-id=”resizeElement”></div>
    <textarea class=”smart-text-box-hidden” autocapitalize=”none” autocomplete=”off” cols=”20″ inner-h-t-m-l=”” minlength=”0″ name=”e1205162406″ placeholder=”Insert value” rows=”4″ smart-id=”textBoxHidden” wrap=”soft”></textarea>
    </div>
    <span class=”smart-hidden smart-hint” smart-id=”hint” id=”e1205162406Hint”></span>
    </div></smart-multiline-text-box><div class=”fullScreen”>

    September 22, 2021 at 2:32 pm #102282
    YavorDashev
    Member

    Hi tullio0106,
    Still we are unable to reproduce this scenario as described by you. Using the exact same MultilineTextBox component that you are using when the rows property is set to ‘2’ the height/size of the component is as intended.
    It is possible that you are overwriting the rows value somewhere in your code that is what I would suggest.
    Anyway this is how the HTML is rendered using you code:

    <smart-multiline-text-box id="e497880705" class="elemento_textarea_valore smart-element smart-multiline-text-box smart-drop-down-box has-value" placeholder="Insert value" horizontal-scroll-bar-visibility="auto" vertical-scroll-bar-visibility="auto" enter-key-behavior="newLine" rows="2" value="
        " name="e497880705" drop-down-button-position="right" drop-down-open-mode="default" type="textarea" role="textbox" aria-multiline="true" aria-describedby="e497880705Hint" aria-labelledby="e497880705Label">

    And the textarea:
    <textarea class="smart-input" autocapitalize="none" autocomplete="off" cols="20" minlength="0" name="e497880705" placeholder="Insert value" rows="2" wrap="soft" aria-label="Insert value" smart-id="input" id="e497880705Input"></textarea>
    If you can create a code example that we can reproduce the same scenario it will be the best so that we could be able to give you a solution about it.
    Please, do not hesitate to contact us if you have any additional questions.
    Best regards,
    Yavor Dashev
    Smart UI Team
    https://www.htmlelements.com/

    September 22, 2021 at 3:04 pm #102283
    tullio0106
    Member

    I did the same test using a trivial html page and I got the same result You received.
    But in my complex environment I got the result I showed before.
    I can’t figure where I can do a change because the textarea is not in my html but is generated from smart element.
    In my code I use jquery (3.6.0) and jqueryui (1.12.), I don’t know it it could cause the problem.
    Tks
     

    September 23, 2021 at 8:07 am #102288
    YavorDashev
    Member

    Hi tulllio0106,
    I have tested the MultilineTextBox component with the same version of jQuery and jQueryUI and still no success in reproducing the reported behavior from you.
    If you share code example on how you generate the MultilineTextBox component from your smart element we will be able to find a solution for your use case.
    Please, do not hesitate to contact us if you have any additional questions.
    Best regards,
    Yavor Dashev
    Smart UI Team
    https://www.htmlelements.com/

  • Author
    Posts
Viewing 12 posts - 1 through 12 (of 12 total)
  • You must be logged in to reply to this topic.