Could you point how to enable a right bar form control after it had been disabled?

Hi Experts

Could you point how to enable a right bar form control after it had been disabled?

Under certain conditions a right bar control is disabled:

img001

Accordingly to:
<!-- Begin: Right bar  -->
<aside class="tray tray-right tray290" data-tray-height="match">
    <div class="row">
        <div class="col-xs-12 pln">
            <button 
                class="btn btn-primary btn-gradient btn-alt btn-block item-active save_button" 
                id="create" 
                style="width:100%" 
                type="submit">Novo</button>
        </div>
    </div>
    <hr class="short">

<form id="pesquisar_groups_form">
            <div class="admin-form">
                <h4>Pesquisar</h4>
                <div class="row">
                    <div class="col-xs-12 mb15">
                        <div class="input-group">
                            <span class="input-group-addon ">
                                <i class="fa fa-search c-gray"></i>
                            </span>
                            <input type="text" name="sise" id="sise" class="form-control gui-input br-light light" placeholder="SISE">
                        </div>
                    </div>
                </div>
                
                <div class="row">
                <div class="col-xs-12 mb15">
                    <div class="input-group">
                        <span class="input-group-addon ">
                            <i class="fa fa-search c-gray"></i>
                        </span>
                        <span class="select">
                            <select id="fk_seguradora" name="fk_seguradora">
                                <option value="" selected="selected">...Seguradora...</option>
                                <option value="1">XXXXX</option>
                                <option value="2">YYYYY</option>
                                <option value="3">ZZZZZ</option>
                            </select>
                        </span>
                    </div>
                </div>
               </div>
                ....
            </div>
        </form>
    </aside>
    <!-- End: Right bar-->

</section>

Open in new window


What I tryed in jQuery :

        $('#pesquisar_groups_form input').prop("disabled", false);

Open in new window

Could you suggest something?
Thanks in advance
Eduardo FuerteAsked:
Who is Participating?

[Webinar] Streamline your web hosting managementRegister Today

x
 
Slick812Connect With a Mentor Commented:
I am reluctant to say much at this point, because this page output seem very complicated with many PHP included files and many Javascript files (jquery, bootstrap, datatables, datatables-add-on) and in your files that you have shown (php files) the datatables seem to be formed in PHP code and in Javascript, which to me is more difficult to look for and find page javascript problems because you have PHP echo output that looks like it is from a PHP datatable "format" plugin.

However you did trace the popup menu link creation to this -
      <a href="#" class="crud-view" data-id="' . $result_model->{$primary_key} . '">Visualizar</a>
and to me the thing that was DIFFERENT from the -
      <a href="#" class="crud-gerar" data-id="' . $result_model->{$primary_key} . '">Gerar Guia</a>
      <a href="#" class="crud-edit" data-id="' . $result_model->{$primary_key} . '">Editar</a>

was this class -
      class="crud-view"

so in the javascript (don't ask me which one) , I would look for -
       $(".crud-view").on("click", function(){

to see what that menu click would do.
But you have javascript in the .js files and the .php files

I looked in only some of the php files you show here, but in a text search for "crud-view" I did not find it in any javascript? ? ?

I know how frustrating this is for you, because I have done it in trying to find bugs or change the operations of a PHP output page with all kinds of php and javascript files and code.
I really do not have time to look through all of the php code you have given here.
I did not mean to suggest that you look in all of the code. what I meant to say was to use the browser object inspector to "Narrow" and "Reduce" the places (files) and code that you need to look through.
1
 
Ferruccio AccalaiSenior developer, analyst and customer assistance Commented:
Try using
 $('#pesquisar_groups_form input').removeAttr('disabled');
0
 
Eduardo FuerteAuthor Commented:
Hi

It doesn't work.

I tryed to enable the div that has the control (accordingly with the code above)
 $("#admin-form: input").attr("disabled", false);

Open in new window


Not success too.
0
The new generation of project management tools

With monday.com’s project management tool, you can see what everyone on your team is working in a single glance. Its intuitive dashboards are customizable, so you can create systems that work for you.

 
Slick812Commented:
? ? the -
     <select id="fk_seguradora" name="fk_seguradora">

is a SELECT, which may not correspond to the "input" filter you use

if you are just targeting that SELECT you may can use it's ID -
      $("#fk_seguradora").removeProp("disabled");
0
 
Marco GasiFreelancerCommented:
Just this:
$('#pesquisar_groups_form input, #pesquisar_groups_form select').prop("disabled", false);

Open in new window


See it in the usual page: http://test.webintenerife.com/2modals_selectors.php
0
 
Eduardo FuerteAuthor Commented:
Hi Slick812

If I use the modal edit the combo is no longer enabled until relaod the page.


Marco

I applied your code and didn't work.  I don't see the filter feature in the page you pointed.
0
 
Slick812Commented:
in your Question you give the event "condition" for -
      "after it had been disabled?"

and in your last comment you say =
     "If I use the modal edit the combo is no longer enabled"

and when the SELECT control is written to the page as -
      <select id="fk_seguradora" name="fk_seguradora">

it is NOT disabled as would be in this control creation -
      <select id="fk_seguradora" name="fk_seguradora disabled">

so this SELECT starts out as being Enabled?

So there is an event at some point on the operations of the page that  you have just told us about as "after it had been disabled?"

So how can we help you in getting this SELECT back to being enabled, , , , , if you do not tell us how it gets to be "disabled" ? ?

So You need to "prevent" the page operation "progression of events" that you say disables this SELECT control.. . . But you do NOT show anything like a "click event" or user page scroll th
0
 
Julian HansenCommented:
Under certain conditions a right bar control is disabled:
Under which conditions - the code you posted does not have the attribute "disabled" specified for the <input> control so where is that coming from? Are you sure it is disabled in the HTML disabled context?

Can you post the rendered HTML of the page?
1
 
Eduardo FuerteAuthor Commented:
Hi

Making it comprehensive as needed:

When the page opens the left lateral controls, used as filters are all enabled:
img001
After the "gear" control is opened -  a menu apper, chosing "Visualizar" an view modal is oppened.
img002
Then when the modal is closed, 02 controls are disabled.
img003
The code:
codigo_tela.txt
0
 
Julian HansenCommented:
Can we rather see the rendered html - without the rest of your backend code and data - we can't see what is going on.

Can you right click on the disabled controls and view in the console - then right click on the container for the control (the closest parent) and copy the HTML and paste it here.
0
 
Eduardo FuerteAuthor Commented:
I inspect the disabled element:

img_EE_111016_005-1-.png
0
 
Eduardo FuerteAuthor Commented:
Correspondent HTML code:

	<!-- Begin: Barra a direita -->
    <aside class="tray tray-right tray290" data-tray-height="match">
        <div class="row">
            <div class="col-xs-12 pln">
                <button 
                    class="btn btn-primary btn-gradient btn-alt btn-block item-active save_button" 
                    id="create" 
                    style="width:100%" 
                    type="submit">Novo</button>
            </div>
        </div>
        <hr class="short">
        <form id="pesquisar_groups_form">
            <div class="admin-form">
                <h4>Pesquisar</h4>
                <div class="row">
                    <div class="col-xs-12 mb15">
                        <div class="input-group">
                            <span class="input-group-addon ">
                                <i class="fa fa-search c-gray"></i>
                            </span>
                            <input type="text" name="sise" id="sise" class="form-control gui-input br-light light" placeholder="SISE">
                        </div>
                    </div>
                </div>
                
                <!--EF Set/2016 --- Novos campos de filtro -->
                <div class="row">
                <div class="col-xs-12 mb15">
                    <div class="input-group">
                        <span class="input-group-addon ">
                            <i class="fa fa-search c-gray"></i>
                        </span>
                        <span class="select">
                            <select id="fk_seguradora" name="fk_seguradora">
                            
                                <!-- EF 2016/Out - 03
                                <option value="" selected="selected">...Seguradora...</option>
                                -->
                                <option value="" selected="selected">...Cliente Corporativo...</option>
                                <option value="1">Ace</option>
                                <option value="2">Zurich</option>
                                <option value="3">Banco Safra</option>
                            </select>
                        </span>
                    </div>
                </div>
               </div>

....

Open in new window

0
 
Julian HansenCommented:
@Eduardo,

We need more than that - there is obviously JavaScript at play here - which is probably what is behind the disabled. The HTML you have posted does not contain anything that shows an element is disabled - we need to see the full picture.
0
 
Julian HansenCommented:
@Eduardo - I missed your post of your screen shot.

Based on that I have the following comments.
From your original post
 $('#pesquisar_groups_form input').prop("disabled", false)

Open in new window

The control you are highlighting in the image is a <select> not an <input> so the code above will not target it you would either need
 $('#pesquisar_groups_form select').prop("disabled", false)

Open in new window

Or better
 $('#fk_seguradora').prop("disabled", false)

Open in new window


Having said that - your screen shot shows that the <select> has no options - whereas the code you posted has options - so (from what I can see) something is removing those options from the <select> - and possibly doing the disable at the same time. This means that adding the code above to page load might not have the desired effect as the process that is removing the options (and potentially disabling the control) runs afterwards.

Try the suggestion above and if that does not work then we will need to see more of the code - specifically the javascript on the page.
0
 
Slick812Commented:
OK, , I have TRIED to look over the code you have in the -
    codigo_tela.txt
and I have also looked at the image of the -
   "I inspect the disabled element:"

and your problem seems to be caused by the DATATABLE, , it looks like it has a "clickable" GEAR symbol in it that you say -
     After the "gear" control is opened -  a menu apper, chosing "Visualizar" an view modal is oppened.

and then the JAVASCRIPT that is used when the view modal "Visualizar" is clicked to close that MENU. . .  I can not find in the codigo_tela.txt  code anything about the "MENU" that pops up . . . AND I can not find the DATATABLE "gear" control or click event for tha "Visualizar" javascript that disables the two search Selects in the Pesquisar form. This seems to be some JAVASCRIPT trace and look for the code of that "Visualizar" javascript click that disables the selects? ? I looked in your code for the meeta-view class in your object inspector SELECT, but that meeta-view is NO WHERE in that codigo_tela.txt  code, , so I wonder if there might be some confusion about the various "pop ups" and controls and id that are referenced here? ? ? I do not think that any code like -
      $("#fk_seguradora").removeProp("disabled");

will do anything, UNLESS in the javascript the code that disables the selects can be found? ? ?
0
 
Eduardo FuerteAuthor Commented:
Hi

@Slick812
The controls are disabled just when the "view" modal is opened, the datatable's gear option is just a menu for doing that. If I open the "edit" modal , via the same menu gear, the controls aren't disabled.

You suggest to check at every javascript - one by one?
img001

@Julian
Based on what you posted I code:

$(function () {
      $('#view').on('show.bs.modal', function () {
    		$('#view input').prop("disabled", false);
            
            
             //$('#pesquisar_groups_form input, #pesquisar_groups_form select').prop("disabled", false);
            
            $('#pesquisar_groups_form input').prop("disabled", false);
            $('#pesquisar_groups_form select').prop("disabled", false)
            $('#fk_seguradora').prop("disabled", false)
            //----------------- 
   
        });
   ....

Open in new window


Unfortunatelly with no effect.
0
 
Eduardo FuerteAuthor Commented:
Sorry.


I guess the reason is a repeated id for that combos in the modal view and in the right bar filter. I'm better checking it.
0
 
Julian HansenCommented:
Try the suggestion above and if that does not work then we will need to see more of the code - specifically the javascript on the page.
From what I can tell the underlying HTML does not have the disabled property set - so it is probably being set after the fact by JavaScript. Did you code the menu and popups or is part of a plugin?
0
 
Eduardo FuerteAuthor Commented:
I'm better checking since I'm new in this project. It seens it's a part of datatables plugin.
0
 
Eduardo FuerteAuthor Commented:
Sorry the delay.

Realy, the view uses a helper - this helper manipulates datatables plugins. Finding what this helper does is not a very direct task, maybe it changes the forms behaviour, making it a little "impredictable"

View (with parts that calls the Codeigniter helpers)
index_EE_151016.php
0
 
Eduardo FuerteAuthor Commented:
The helpers:

datatables_helper
datatables_helper_EE_151016.php

datatables_ajax_gerar_helper  (at line 27 the view modal was created)
datatables_ajax_gerar_helper_EE_1510.php

datatables_crud_modal_helper (called at the end of the index)
datatables_crud_modal_helper_151016.php

Probably something here could explain the "impredictable" - control's enabled / disabled behaviour when the view modal is called.

The view modal was recently created by me just using little references I had.

Sorry if I am asking a hard effort from you. One thing I know... you are very capable!
0
 
Julian HansenCommented:
@Eduardo,

Apologies but I am getting a bit lost. The question is about how to enable a control that is disabled. The code we have seen so far is not enough to build a comprehensive understanding of what we are dealing with - and nowhere in that code does there appear to be a disabled property - so something else is setting that property after page load. Datatables is in there somewhere but whether this is part of the Datatable on the page or a feature that has been bolted on - I am not clear.

So the question is did you write the code for the sidebar menu or is that part of some plugin?
0
 
Eduardo FuerteAuthor Commented:
Hi

Here is the complete index - the sidepart menu starts at line 1101 until 1265
 index_complete_EE_151016.php

... a helper that is called at very beginning of the index.
breadcrumb_helper_EE_151016.php

I omited some helpers that I know out of context - If you find a "gap" I can give you later.

Maybe you conclude the helpers called by the view doesn't cause any sidebar enable/ disable unpredictable behaviours...
0
 
Julian HansenConnect With a Mentor Commented:
I don't think we are going to be able to help you based on the code you have posted. This is something we need to see happening. I get the feeling that there is a missing piece that we have not seen yet which might only become obvious seeing the page in action.

What I did notice was in the code you posted (first link) there are a lot of places where .prop({disabled} : true / false}) is used - I would go through each one of those and try to see if there is not a side effect where one of those is triggering the disabled.

Something is setting the disabled property - to find it though we need the full picture.

Bottom line though - without being able to see it happening - and not having full access to the underlying HTML / JavaScript / CSS source - very difficult to fix.
0
 
Eduardo FuerteAuthor Commented:
Hi

Thank you for replies.

I'm trying to make the site running internet - actually it's still local, to make it visible and get a  better position from you.

Amazingly something is preventing it to runs, maybe a .htaccess issue. I'm trying to solve it  and maybe will ask here in this topic.
0
 
Eduardo FuerteAuthor Commented:
@Slick 812

You're perfectly right.


	$("#view")
		.on("view", function(e, data) {

		var $form = $(this);

			$.each(data, function(field, value) {
				
				var
					avoid = ' . json_encode($options['edit']['avoid']) . ',
					$field = $form.find(\'[name="\' + field + \'"]\'),
					tag = ($field.length ? $field.prop("tagName").toLowerCase() : undefined)
				;


				//EF 2016/Out - 06 - Desabilita incorretamente no modal view - Verificar -----
				//if(field != "id" && field != "idinterface_users" && field != "_pass" && field != "_pass2")
				//	$("#"+field).attr("disabled",true);$("#view")
		.on("view", function(e, data) {

		var $form = $(this);

			$.each(data, function(field, value) {
				
				var
					avoid = ' . json_encode($options['edit']['avoid']) . ',
					$field = $form.find(\'[name="\' + field + \'"]\'),
					tag = ($field.length ? $field.prop("tagName").toLowerCase() : undefined)
				;


				//Disabled-----

                                    //if(field != "id" && field != "idinterface_users" && field != "_pass" && field != "_pass2")
				//	$("#"+field).attr("disabled",true);

Open in new window


A helper outputs this code at the end of the page.
0
 
Eduardo FuerteAuthor Commented:
Thank you for assistance and patience!
0
All Courses

From novice to tech pro — start learning today.