Forums

Hi,

I need to put some conditional code on the form dependent on the values loaded to the form fields from the database table.

If two email addresses match (taken from two database tables) I want to enable Submit button of one kind. If the addresses are different Submit action would be different.
I wrote the JS code comparing the fields, I have two buttons (one for each action) made with Custom Elements and I want to switch one off with JS setting "display:none" style.
Everything is ready, but I could not call the switching JS function in the right moment.
The form is loaded with Show HTML action. If I put "Load JS" with the function call it is ignored.
If the function call is before "Show HTML" the form is not loaded so fields are empty.

There are many smart peaple reading this forum...
Maybe someone did "submit" button switchover before...

Regards
Henryk

Hi Henryk,

Please post the script you have written; or a link to the form.

I don't understand why the form stops loading? You have the JavaScript in a Load JS action before the Show HTML action in the On Load event?

Bob

Hi,
First the code below is testing one, it does not switch any classes, just alerting the field values.

The events in OnLoad section:
Load JS:

function ustal_zgodnosc(){

var eKonta = document.getElementById('jus[email]');
var eSzkoly = document.getElementById('szg[email]');
var eOpiekuna = document.getElementById('szg[opiekun_email]');

alert('Ustalam zgodnosc');
alert('Użytkownik:'+eKonta.value+'\n'+'Szkoła:'+eSzkoly.value+'\n'+'Opiekun:'+eOpiekuna.value);

}

window.addEvent('domready', function() {
  $('chronoform_uprawnieniaNadaj').addEvent('load', ustal_zgodnosc);
});

ustal_zgodnosc();

Show HTML
Load JS

ustal_zgodnosc();

The form is called 'uprawnieniaNadaj' so I hoped addEvent method would add 'ustal_zgodnosc' to the form 'onload' event.
Calling directly also fails...

None of calls to 'ustal_zgodnosc()' works.
I suppose I don't understand the code sequence and put the code in the wrong moment.
I explained earlier the purpose of JS code so you could give me different idea...

Regards
Henryk

Hi Henryk,

Well there are various things that will cause problems. I don't think that [ or ] are allowed in HTML Ids so the getElementById('jus[email]'); probably won't work.

I don't think that a <form> tag has an 'OnLoad' event so that may not work either.

Here's a modified version - it requires the IDs to be changed:

window.addEvent('domready', function() {
  $('jus_email').addEvent('change', ustal_zgodnosc);
  $('szg_email').addEvent('change', ustal_zgodnosc);
  $('szg_opiekun_email').addEvent('change', ustal_zgodnosc);
  ustal_zgodnosc();
});

function ustal_zgodnosc(){
  var eKonta, eSzkoly, eOpiekuna;
  eKonta = $('jus_email').value;
  eSzkoly = $('szg_email').value;
  eOpiekuna = $('szg_opiekun_email').value;
  alert('Ustalam zgodnosc');
  alert('Użytkownik: '+eKonta+'\n'+'Szkoła:'+eSzkoly+'\n'+'Opiekun:'+eOpiekuna);
}

Bob

Bob,
The usage of [] is because it is used with CC connection which is the way to run a bit complex query with 2 relations and model usage.
If you want to use the model names in CC and then call the edit form to view connection dataset you need to name the fields in the form as I did with [].

I'm gonna check if brackets are the problem for JS and let you know when solution found

Henryk

Hi Henryk,

Sure, you need the brackets in the input names and they are OK there. It's the IDs that may be the problem.

Bob

Here is the body of JS code that does what I need - description above.
There is no problem with the brackets..
The JS events for the form are limited so event is added to the whole document window and works well.
Thank you for trying help me anyway..

bighen

function ustal_zgodnosc(){

var b0 = document.getElementById('setprawa0');
var b1 = document.getElementById('setprawa1');


var eKonta = document.getElementById('jus[email]');
var eSzkoly = document.getElementById('szg[email]');
var eOpiekuna = document.getElementById('szg[opiekun_email]');


if (eKonta.value != eSzkoly.value && eKonta.value != eOpiekuna.value) {
    b0.style.display = 'none';
    b1.style.display = 'block';
    }
}

window.onload = function(){
ustal_zgodnosc();
}