Change color of fields. Select all fields of a class

rss

Posted by Phoenix - Jun 16 ’15 at 10:04

Hi There

 

I have 2 questions:

  1. I'm trying to add a CSS class to multiline plain textareas when another field changes. I tried all the following CSS selector, but it won't change:

.required textarea {

border: 2px solid #AA88FF;

background-color: #FFEEAA; }

.required input[type='text'] {

....

}

.required input {

.....

}

.required .ms-rtefield {

...

}

 

Code handling:

fd.field('Scope').change(function(){

if (val != 1) {

fd.field('Scope_x0020_Txt').titleRequired(true);

fd.field('Scope_x0020_Txt').addClass('required');

} });

 

2. My second question: Is it possible to lets say handle all the fields with a certian class? I was thinking of

$('#required').each(function () {

If field('xyz').value() == '';

}

 

is it possible?

 

Thanks a lot for the reply.,.

  • Dmitry Kozlov
    Dmitry Kozlov
    Admin
    Member for: 9 years 6 months 8 days
    #1 by Dmitry Kozlov Jun 16 ’15 at 11:17

    Hi,

    1. What type of multiline text field do you use: Plain text, Rich text, or Enhanced rich text?

    2. Please, use the code below:

    $.each($('[fd_name]'), function() { 
    if (fd.field($(this).attr('fd_name')).value() == '') {
        ...
    }
})
    link flag
  • Phoenix
    Member
    Member for: 8 years 3 months 20 days
    #2 by Phoenix Jun 17 ’15 at 12:09

    Hi dimitri

     

    Thanks for the fast reply. I use a plain textarea.

     

    Considering the "Each" function. With your code it looks like i have to check for each field (FD_NAME) ? Cant't i generally loop through all the fields of a certain class?

    link flag
  • Dmitry Kozlov
    Dmitry Kozlov
    Admin
    Member for: 9 years 6 months 8 days
    #3 by Dmitry Kozlov Jun 17 ’15 at 05:18

    [#2]: Please, use the following code to assign an additional CSS class to the field's control:

    fd.field('Scope_x0020_Txt').control()._el().addClass('required');

    Regarding the loop through the fields, do you need to loop through a particular type of fields? If so, what type?

    link flag
  • Phoenix
    Member
    Member for: 8 years 3 months 20 days
    #4 by Phoenix Jun 18 ’15 at 01:03

    Thanks, this actually works.

     

    Well I sort of would like to check, when user clicks the submit button, if any field has the the class 'required' and if the send an alert to fill in this field. Dunno if this is possible.

    link flag
  • rostislav
    rostislav
    Moderator
    Member for: 7 years 10 months 22 days
    #5 by rostislav Jun 18 ’15 at 05:44

    [#4]:

    Please use the following code:

    var alertMessage;
$.each($('[fd_name]'), function() { 
    if ($(this).find('.required').length > 0 /**if needed add here a check for emptiness of your fields, field names are retrieved by $(this).attr('fd_name')**/) {
		if (alertMessage == undefined) {
			alertMessage = "Please fill in the following fields: \n";
		}
        alertMessage += fd.field($(this).attr('fd_name')).titleText() + "\n";
    }
})
if (alertMessage != undefined) {
	alert(alertMessage);
}

    If you need to check if your required fields are empty, you'll need to insert respective checks in place where my comment is. Please note, that different field types' values are retrieved differently.

     

    link flag
  • Phoenix
    Member
    Member for: 8 years 3 months 20 days
    #6 by Phoenix Jun 23 ’15 at 10:14

    Thanks I will try that. Just to be clear... i do not have to replace fd_name..?

    link flag
  • rostislav
    rostislav
    Moderator
    Member for: 7 years 10 months 22 days
    #7 by rostislav Jun 24 ’15 at 04:59

    [#6]:

    No, you don't.

    link flag
  • Phoenix
    Member
    Member for: 8 years 3 months 20 days
    #8 by Phoenix Jun 25 ’15 at 01:59

    Thanks, I'm sorry I get i know.

     

    Your code works fine thank you. Though I have another question related to your code:

    alertMessage += fd.field($(this).attr('fd_name')).titleText() + "\n";

    I always get blanc, although I have set a Title value in the form editor, do I have to add a title in code as well?

    The css is working fine for the plain textarea, I tried to apply it to a choice field (dropdownbox) with

    .required select

    Is this wrong?

    link flag
  • rostislav
    rostislav
    Moderator
    Member for: 7 years 10 months 22 days
    #9 by rostislav Jun 25 ’15 at 04:57

    [#8]:

     

    No you don't have to change title using code. Are you using exactly the code we provided or have you maybe added your own stuff, e.g. conditional statements?

    The css selector for a dropdown is exactly what you thought it was. E.g.

    .required select {

    background-color: #FFEEAA;

    }

    would do the trick.

     

    If you're using the code we sent you and it doesn't work, please send us the source code of your page (e.g. in Chrome right click -> View page source) to [email protected] and we'll try to replicate your issue.

    link flag
  • Phoenix
    Member
    Member for: 8 years 3 months 20 days
    #10 by Phoenix Jun 26 ’15 at 08:27

    Thank you. I used almost the same code as you provided.

    $.each($('[fd_name]'), function() {

    if ($(this).find('.required').length > 0 ) {

    if (alertMessage == undefined) {

    alertMessage = "Please fill in the following fields: \n";

    }

    if (fd.field($(this).attr('fd_name')).titleText() == "") {

    alertMessage += i + ": marked with the red asterix or red dotted border \n";

    } else {

    alertMessage += i + ": " + fd.field($(this).attr('fd_name')).titleText() + "\n";    

    }

    i++;

    }

    })

     

    With css for the dropdowsn , adding the !important; did the trick

    link flag
Displaying 1 to 10 of 10 messages

Related threads