neda
neda

Reputation: 13

changing the id of div with jquery of javascript

I have a html file that has a section for writing mdxquery , file sends queries to a js file and that file use this queries and other information and show a map on my html file, know i need to change this mdxqueries automatically by selecting different checkbox, i define different queries for different selections(my selectins are limmited), and now i want replace them in div section for it i defined different div(as you'll see dives are particular and the content of them is inside the div tag and arent changeable) that have different queries, now the problem is that, the js file read the queries ofdiv with just particular div, therefor i need to change the id of div , here is my cod that dont work, please see the code and tell me what is wrong:

    <div class="first" style="width:80%;" id="mdxQueryEditor"
            dojoType="GeoSOA.Spatialytics.widgets.MdxQueryEditor" title="MDX query editor"
            submitButtonLabel="Submit"
            mdxQuery="SELECT {[Measures].[report]} ON COLUMNS,&#x000A;{[State].[City].members} ON 

ROWS&#x000A;FROM [ppgis]">
        </div>

<div id=""  class='second' dojoType='GeoSOA.Spatialytics.widgets.MdxQueryEditor' style='width:100%;display:none;' 

mdxQuery='SELECT {[Measures].[report]} ON COLUMNS,&#x000A;{[Boston].[City].members} ON ROWS&#x000A;FROM [ppgis]' 

submitButtonLabel='Submit'></div>
<div  id=""  class='third' dojoType='GeoSOA.Spatialytics.widgets.MdxQueryEditor' 

style='width:80%;display:none;' mdxQuery='SELECT {[Measures].[report]} ON COLUMNS,&#x000A;{([State].[All States].

[Boston].[Allston / Brighton], [Subject].[All Subjects])} ON ROWS&#x000A;FROM [ppgis]' 

submitButtonLabel='Submit'></div>


    <script>
function generatorChoice(){
     if(($("#Allston").is(":checked") )&&( !$("#All State").is(":checked")) && (!$("#Boston").is(":checked"))){
        /*When the checkbox is checked*/
        $(".first").attr("id", "");
        $(".third").attr("id", "mdxQueryEditor");
        $('.first').css('display','none');
        $('.second').css('display','none');
        $('.third').css('display','block') ;
    }
}


</script>

Upvotes: 0

Views: 95

Answers (2)

Odin
Odin

Reputation: 226

I usually use getElementBy, for example I do this

var myDiv =  document.getElementById('div1');
myDoiv.setAttribute('id', 'div2'); 

Upvotes: 0

SridharVenkat
SridharVenkat

Reputation: 656

I see a code $("#All State").is(":checked"), this could be potentially wrong.

Here you are trying to grab element with Id - "All State", but HTML Id's cannot have spaces in between, If that's not meet code inside If condition will not be executed and Id will not change.

Upvotes: 2

Related Questions