Solved

JQuery

Posted on 2013-10-23
8
134 Views
Last Modified: 2013-10-23
I am trying to put an icon before a series of dom elements that contain a required select.  

For example, I have the following div structures:
<div class="1">
    <div class="2">
        <select class="required">
    </div>
</div>

<div class="1">
    <div class="2">
        <select>
    </div>
</div>

I need to place the required icon in front of <div class="1"> that contains <select class="required">.

When I tried to do that it placed it in front of all <div class="1"> instead of just the <div class="1"> containing the <select class="required">.

How do I get it to show up in front of just the divs that contain the required select?

Thanks!
0
Comment
Question by:cgjenkins
  • 4
  • 3
8 Comments
 
LVL 22

Expert Comment

by:Mrunal
ID: 39593871
Hi
Can you share more information like how it is currently looking and how exactly you want it to look?

also share css definition for "required" and all others.
0
 
LVL 30

Expert Comment

by:Alexandre Simões
ID: 39593896
Something like this?
$('select.required').closest('div.1').before('<img src="image url" />');

Open in new window

0
 

Author Comment

by:cgjenkins
ID: 39593899
Here is the script:
$('div.1').ready(function() {
    if ($('h5').children('select.required') && !$(this).next().is('span.required')) {
        $('div.1').before('<span class="required">&nbsp;</span>');

    }
});
0
Netscaler Common Configuration How To guides

If you use NetScaler you will want to see these guides. The NetScaler How To Guides show administrators how to get NetScaler up and configured by providing instructions for common scenarios and some not so common ones.

 
LVL 30

Expert Comment

by:Alexandre Simões
ID: 39593907
Be aware that the div might break the line.
If the image is related to the select you might also consider put it before (or after) the select itself:
$('select.required').before('<img src="image url" />');

Open in new window

0
 

Author Comment

by:cgjenkins
ID: 39593946
I have tried that, but the select is wrapped in two divs (I didn't create it, I just have to deal with it :) ), so the icon has to go outside of div.1.
0
 
LVL 30

Accepted Solution

by:
Alexandre Simões earned 500 total points
ID: 39594043
So use my first option!
$('select.required').closest('div.1').before('<img src="image url" />');

Open in new window

0
 

Author Comment

by:cgjenkins
ID: 39594316
That one almost works.  However, if I have two div.1s with select.required, I get two icons outside of the first div.1 Instead of one outside of each div.1 that has a required select.  See two required icons
0
 

Author Closing Comment

by:cgjenkins
ID: 39594454
I resolved it with .each() :).  Thanks!
0

Featured Post

Efficient way to get backups off site to Azure

This user guide provides instructions on how to deploy and configure both a StoneFly Scale Out NAS Enterprise Cloud Drive virtual machine and Veeam Cloud Connect in the Microsoft Azure Cloud.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Have you tried to learn about Unicode, UTF-8, and multibyte text encoding and all the articles are just too "academic" or too technical? This article aims to make the whole topic easy for just about anyone to understand.
JavaScript has plenty of pieces of code people often just copy/paste from somewhere but never quite fully understand. Self-Executing functions are just one good example that I'll try to demystify here.
Viewers will learn about arithmetic and Boolean expressions in Java and the logical operators used to create Boolean expressions. We will cover the symbols used for arithmetic expressions and define each logical operator and how to use them in Boole…
The viewer will learn the benefit of using external CSS files and the relationship between class and ID selectors. Create your external css file by saving it as style.css then set up your style tags: (CODE) Reference the nav tag and set your prop…

777 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question