1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

In Laravel 5.7 app make validation with tinyMCE editor

Discussion in 'HTML & Website Design' started by mstdmstd, Nov 5, 2018.

  1. #1
    Hello,
    In my Laravel 5.7 application I use laravel-jsvalidation plugin( https://github.com/proengsoft/laravel-jsvalidation/wiki/Basic-Usage )
    and it worked ok,
    I needed to including textarea input as tinyMCE editor and to use i with validation and I implemented it with 2 textarea inputs :

    <div class="form-row mb-3 {{ in_array('description', $errorFieldsArray) ? 'validation_error' : '' }}">
    <label class="col-xs-12 col-sm-4 col-form-label">Description</label>
    <div class="col-xs-12 col-sm-8">
    <span style="display: inline;">
    {{ Form::textarea('description', isset($vote->description) ? $vote->description : '', [ "class"=>"form-control editable_field textarea_input ", "rows"=>"0", "cols"=> 120, "id"=>"description", "autocomplete"=>"off", "style"=>"width:0; height:0" ] ) }}
    </span>
    {{ Form::textarea('description_container', isset($vote->description) ? $vote->description : '', [ "class"=>"form-control editable_field textarea_input ", "rows"=>"5", "cols"=> 120, "id"=>"description_container", "autocomplete"=>"off" ] ) }}
    </div>
    </div>
    HTML:

    where 1st textarea is for form submitting, as entered content is copied into it from 2nd textarea, which is used as

    tinyMCE editor.
    In tinyMCE definition I added rows:
    
    setup: function (editor) {
    editor.on('change', function () {
    var current_context= tinymce.get(by_selector_container).getContent()
    $('#' + by_selector).html( current_context );
    });
    },
    
    Code (JavaScript):
    where by_selector_container and by_selector are names of these textarea inputs. It works, but the only problem that on page I can see 1st textarea input,
    despite I try to hide it setting wight.width in 0 in style of my code above, but anyway
    I still see small textarea input, which I want to hide : https://imgur.com/a/43FRFJU

    I tried to usee css styles in declaration of the 1st textarea input to set
    "style"=>"display:none"
    HTML:
    Than textarea input was hidden, but validation does not work at all.
    SEMrush
    How to hide it this small textarea input with validation working?

    Thanks!
     
    Solved! View solution.
    mstdmstd, Nov 5, 2018 IP
    SEMrush
  2. #2
    {display: none;} makes the element non-existent. Try using the visibility property, e.g. {visibility: visible | hidden | collapse | inherit;}

    gary
     
    kk5st, Nov 5, 2018 IP
  3. pawon

    pawon Peon

    Messages:
    6
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    1
    #3
    Gary is right, display: none is the problem. You need to hide it by setting the visibility to hidden, or using another trick like setting the height to zero, make it absolute positioned off the visual page, etc.

    Pawon
     
    pawon, Nov 12, 2018 IP