I have a site on which I use several divs with one class, which are displayed, and severals divs with an other class which are hidden.
I would then like to have two buttons, which I can use to toggle between which one of the two classes are displayed, with the button for the currently displayed class beeing inactive.
When the button is clicked I would like it to take effect all through the site, so the correct class is also displayed or hidden on other pages on the site.
To simplify:
So if I click button A, class A is displayed all through the site, and button B is hidden. If I then click button B, class B is displayed all through the site, and button A is hidden.
Any ideas to an easy solution for this?
Since new UK legislation requires you to tell the users of the website about all cookies the website stores on their machine, I would recomend you use a session variable, you could use $_SESSION['class']="class1"; using PHP or you could use Session["class"] = "class1"; in C#, you could then check that session variable using an if statement by doing:
if($_SESSION['class'] == "class1")
{
// show class 1
}
else
{
// Show class 2
}
Te above code will work in C# by replacing the $_SESSION['class'] with Session["class"] To show or hide a div, you could either do it server side by adding the different styles in problematically or you could use javascript, though I'm not sure how you'd gain access to session variables via JavaScript since they are server side. JQuery would be a good library to use for showing/hiding DIVs though.
I'd probably store the current state in a cookie if it were me. Then just display/hide as it fits the users current state.
Related
is there an option or maybe a small custom code to make Gravity Forms radio buttons jump to a field on selection?
In my example, i have a list of 14 options. Using a condition logic when you select one option a custom HTML is revealed right under each and every option. For desktop is super ok, the screen is big and all fit well. The problem is for mobile devices because you select an option but after that, you have to scroll to see the custom HTML.
Is there any option or custom code snippet in Gravity Forms that jumps to that custom HTML when an option is selected?
I found some resources on how to make this using HTML code with ids but this is somehow dynamic though the HTML code is placed in the same position. My first idea was to add the same ID to each and every HTML code so that when a radio button is pressed it scrolls to that ID. Don't know if it makes sense but ...
Can someone help me with some resources or give me some hints? Many thanks.
I have a site which is populated from a database. I want to access the pages in Selenium. The number pages associated with a particular topic is variable.
Using Selenium I am clicking through successive pages using a line like
driver.find_element_by_xpath("""//*[#id="mainContent"]/
div[2]/div/div[2]/div[1]/
div[3]/div[2]""").click()
This works successfully.
However I would like to detect when the element I am clicking (a next button) is "greyed" out rather than having to predict how many pages are available.
Currently I am using a block of code inside a for loop with a counter for the number of available pages.
EDIT: The page element has the word Inactive added when it is "greyed out" as in
<div class="paginationBtn paginationNextContainer inactive"><div class="icn chevron-left"></div><div class="visuallyHidden">Previous</div></div>
If your button is changing its color on click, it's associated with CSS attribute.
I advise to look at this answer to learn the subject. For your case, I advise you to develop a method to get the button color value before and after, as your script should operate accordingly.
I would like use an html/css menu and hide menu items based on users permissions/rights. What would be the best way to handle this? Can it be done just using CSS/HTML or using scripting like Javascript.
The permissions are through "allow roles" subfolders with web.config authorizations. So users cannot go to the wrong page but I want to hide the choices they can't actually access.
I am using VB.net code behind FYI.
You can't do this in static CSS/HTML, but you could print different CSS statements for each role if you dynamically generate it.
Or you could assign class 'admin' to certain items, set to display:none in CSS then use jQuery to show them:
if(userIsAdmin)
{
$('.admin').show();
}
However, I prefer to do this server-side if possible and only print certain items for certain users because, as Yoda said, anyone can see the source if you do it client side.
This seems simple enough but I can't quite think of how to actually do it...
In IBM Web Content Management (WCM) version 7 I have a Presentation Template (PT) which calls a Menu Component to display some content items.
I also have some (static) links on the sidebar which I want to basically just change the menu component that is being used, and that's it.
So for example...
In the PT:
[Component name="Main Page"]
When I click on a link, I want the exact same PT to be displayed except I want it to use:
[Component name="Next Page"]
Basically, Main Page and Next Page are showing the same content items, they just have different filters on them (so they appear to be different pages). The "Main Page" shows "everything" and then if you click on a link it's suppose to only show a subset of that.
I can't quite figure out how to connect the link to the PT to change it. I've thought about using JavaScript or JSP to simply rewrite the HTML, but even then I'm not sure how I set it up to say that: "if the link has been clicked, rewrite the HTML" because I'm not sure what to even point the link to, or pass through the link.
I thought about creating different content items with different PTs to link to, but there are about a dozen links (and therefore a dozen different Menu Components that I want to use), so I thought it might be better in the long run to just use 1 dynamic PT (in case the number of links grows).
It is only that one component that needs to be changed in order to display how I need for every link though.
Any ideas how to go about doing this?
So this is how I resolved this:
I created a component reference element in the content items called "menuComp" and then I set that to point to the appropriate Menu Component for each particular page.
In the presentation template, I removed the component reference and changed it to an [Element] tag which used key="menuComp".
I have a basic ASP.Net MVC 3 application which has a number of controllers and a number of actions (and subsequently views)
A common feature of the application is to show a pop-up dialog window for basic user input. One of the key features of this dialog process is a faded mask that gets shown behind the dialog box.
Each of these dialog window controls is in a separate Partial View page.
Now, some view pages may use multiple dialog boxes, and therefore include multiple partial views in them - which as is would mean multiple instances of the "mask" element.
What I am trying to find a solution for is to only need to create one instance of a "mask" element regardless of the number of dialog partial views I include, and then the script in each partial dialog will have access to this element (so basically it just needs to be on the page somewhere)
The only real idea I have come up with so far is to add the "mask" element to the master page (or in the original view page) and this will mean it only gets added once. The problem here is that it will be added even when it is not needed (albeit one small single element)
I can live with this, but I would like to know if there is a better way to handle these kinds of scenarios?
A quick idea that came to mind is some kind of master page inheritance hierarchy, So I may have a DialogMasterPage that inherits from the standard current master page. How does that sound for an approach?
Thanks
To do something like this, where each module can register their need for a certain thing in the master page, you can use HttpContext to store a flag of whether you need to write the mask div, and just set that property in each partial. At the end of the master page, if the flag is set, you can then write the mask div if its set to true.
Obviously to make this cleaner you could wrap it all in an HtmlHelper extension or something.
My initial thought is for you to use something like jQuery UI where it handles the masking for you or if you are using something custom you can load the content for the dialog via ajax then show it in the single dialog on the master page.