• 0

Help needed in Javascript


Question

HI all I am having trouble getting a javascript to work as I want it.

The code is as follows:

function oc(a) {
	var o = {};

	for(var i=0;i<a.length;i++) {
		o[a[i]]='';
	}

	return o;

	// USE: if( name in oc(['bobby', 'sue','smith']) ) { ... }
}

function toggle() {
	var tagarray = document.getElementsByTagName("div");
	var padding = document.getElementById('padding');
	var arguments = arguments;

	for(var x=0; x<tagarray.length; x++) {
		var tagname = tagarray[x].getAttribute("id");

		if (tagname in oc(arguments) == true) {
			var tag = document.getElementById(tagname);

			if (tag.style.display == "") {
				tag.style.display = "none";
				padding.style.display = "";
			} else {
				tag.style.display = "";
				padding.style.display = "none";
			}
		} else {
			// tagname.style.display = "";
		}
	}

	for(var i=0; i<arguments.length; i++) {
		// alert(arguments[i]);
	}
}

the oc function is to search for a string in an array I found.

I want to call the script like this:

onclick="java script:toggle('products','content'); return false;"

The call is not restricted to how many items 1 or 10...

What it has to do is toggle the display css for a div to hide/show content. by using multiple names in the onclick I should be able to toggle 2 items at once.

Also to avoid conflict I would like the div id's to have an operating extension as in:

products_toggle == toggle

products_show == force display: ; if it isn;t already

products_hide == force display: none; if it isn;t already

I am going nuts on trying to get this to work. I have had it work half way there but not all features at once. The code above opens and closes the items but doesn't close all others that are open. each div will be a content panel and the reason for the multiple id's is so I can open a page panel and then show the relevant sub content on that page. For example I might call about_open, contact this should force open the about panel and show a contact form. the using about_open, privacy it should open about panel if not already and show the privacy content while closing all other div's.

If needed I can abbreviated each toggled div with a name as in id="about_content", id="contact_content" etc.

Please help me.

Link to comment
https://www.neowin.net/forum/topic/631537-help-needed-in-javascript/
Share on other sites

19 answers to this question

Recommended Posts

  • 0

var arguments = arguments;

What are you doing with that line?

You might be interested in jQuery, it is a javascript framework which augments the standard javascript objects with additional ones, so you could probably achieve the above effect in much fewer lines:

function toggle() {
	for (int i = 0; i < arguments.length; i++) {
		$(arguments[i]).toggle();
	}
}

You should be able to call it simply with: toggle("first", "second", "third"); etc.

  • 0

Sorry to be a pain but I don't think I want to use jQuery for just one script. if I was going to use more scripts I would.

The

var arguments = arguments;

is what I have read I must do. arguments is the array of items from the function call, and I have to declare it. I wanted the arguments array to be called arguments.

If its wrong fix it. Im no javascirpt expert. in fact this is the first time I have actually written anything in javascript.

  • 0

jQuery will become very useful if you plan to go into full Web 2.0 development (which according to your other thread, it is planned).

Remove this

var arguments = arguments;

as it is not required, and may be causing your browser to abort the script

  • 0

It may not be required but its definetly not aborting the script. As I said before it works, partly.

And your reading my other post? Got any thoughts about that?

My main issue is not only am I a perfectionist, I believe in opensource and accesability (ie API, plugins etc for customization and integration), I also hate writing the same code over and over again, and I like simple clean minimalistic code. I also would like to write using standards as in standard code, formatting, structure etc. for example if I am doing a menu in a web page I'll use a list. hey I even made an accordion style website once using ONLY <ul>. Never used it just did it to see if I can get the structure to work as <ul> not <div>.

So any help on that would be handy. The script above is also not for the site on the other post. thats a different thing all together.

  • 0

Well, a non-jQuery function could work as follows:

function toggle() {
	for (var i = 0; i &lt; arguments.length; i++) {
		var obj = document.getElementById(arguments[i]);
		obj.style.display = (obj.style.display == "none") ? "block" : "none";
	}
}

Called as "java script: toggle('one', 'two', 'three');".

I have attached an example html document.

test.htmlFetching info...

  • 0

Sorry to be a pain, but there is not consistancy with your test page. click randomly on the links and the same links give different results.

The link to the page I am going to use it on is here: http://eangulus.homeip.net/clients/eangulu....com/index6.php

On my design there is also a div id="padding" that has to be hidden whenever one of the pages is open. Only one page to be open at a time. but the submenu content in each page is the reason for the multiple id need. this way I can use the toggle in a similar fashion for the sub links to change between contetn. and then I can call for example aboutus, will opn aboutus div with about us contetn as default, but click on contact in the bottom footer and it should open aboutus and show the contact form div instead.

At this stage I have each content area id's and the padding id and also the sample contetn under products has the id="content". THere will be more but I have put in enough for testing.

Anyway going to bed now so I will talk in the morning.

  • 0

OK I understand now what your code does.

But I do have some more questions.

How can I search for all elements with an id ending in "_toggle" and have that in an array, then I should be able to go thru each array element and match against the arguments. If it doesn't match close the tag, if it does I want to then search for the ending of the called tag (_open _close or _swap etc) and either open or close according to that answer.

  • 0

Well, unless your planning to increase the number of expanding sections, you could probably get away with an array based function:

function open(id) {
	var layers = ['one','two','three','four','five'];
	for (var i = 0; i &lt; layers.length; i++) {
		var obj = document.getElementById(layers[i]);
		if (obj) {
			if (layers[i] == id) 
				obj.style.display = "block";
			else
				obj.style.display = "none";
		}						
	}
}

  • 0

Ok, final version:

function open(parent, child) {
	var parents = ['one', 'two'];
	for (var i = 0; i &lt; parents.length; i++) {					
		var parentObj = document.getElementById(parents[i]);
		if (parentObj) {
			if (parents[i] == parent) 
				parentObj.style.display = "block";
			else
				parentObj.style.display = "none";
		}	
	}

	var children = document.getElementsByTagName("div");
	for (var j = 0; j &lt; children.length; j++) {
		if (children[j].id.indexOf("_child") &gt; 0) {
			var childId = child + "_child";
			if (children[j].id == childId)
				children[j].style.display = "block";
			else
				children[j].style.display = "none";
		}
	}
}

With an attachment:test.html

  • 0

LOL, you've been watching my page.....

Thank you so much for that last script. Have another look, its working as I want it too now, (only first 2 links under products are setup atm). I also add in the padding.

I know it was getting complicated but I was trying to learn javascript, and I was really only converting the steps in my head to paper so to speak.

Oh and I apologize. the script samples always worked, it was my practice code that was cause the crash. as soon as I deleted all my stuff it work a treat.

Sorry to be a pain in the ass, but is it hard to make the parent items toggle? If it is don't worry cause I was looking at dropping that feature anyway.

This topic is now closed to further replies.
  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Posts

    • Microsoft bans LibreOffice developer's account without warning, rejects appeal by David Uzondu Recently, we reported on LibreOffice, accusing Microsoft of intentionally using complex file formats as a tactic to lock in users to Microsoft Office, hindering open source alternatives like LibreOffice. Now, Microsoft has banned LibreOffice developer, Mike Kaganski, from using its services, citing an "activity that violates [its] Services Agreement". According to Mike, this happened last Monday when he tried to send a technical email to the LibreOffice dev mailing list, which is a normal part of his routine, but Thunderbird returned an error saying the message couldn't be sent. His account was blocked upon retry, and he found himself completely logged out of his Microsoft account. Kaganski guessed that his mail and account were getting flagged by a bot or something, since he was quite sure that nothing in the mail violated Microsoft's terms of service. So he decided to file an appeal, a process which later made him call Redmond "miserably incompetent in IT." The automated system asked for his phone number, which he provided, only to be greeted by a "Try another method" error message. The problem was that there was no other method offered. He then decided to reach out to Microsoft support directly. After some digging, he found a link to contact the team, and there it was, a button asking him to "Sign in to Contact support". Now, you might go, "Hold up, how is he supposed to sign in to contact support when his problem is that he can't sign in in the first place?" As Kaganski himself put it: He eventually got to use his wife's account to file an appeal and finally received a message from support. The instructions inside asked him to go to the sign-in page and, when told the account is blocked, provide a phone number. However, Microsoft ignored his detailed report of the failing process, marked his ticket as resolved without any real action, and simply closed it. He is yet to recover his account. As for the email he was trying to send, he was later able to use Gmail, and it went through with no problem. If you are interested, you can read the full email for yourself and see if it violates Microsoft's services agreement. Mike's not the only person who's had their account locked recently, with seemingly no way to recover it. On the 17th of last month, Reddit user u/deus03690 shared how Microsoft locked their account, which, among other things, contained 30 years of "irreplaceable photos and work" on OneDrive. Their appeal, like Mike's, has been fruitless so far. The user said Microsoft reached out 10 days later, asking them to fill out a recovery form and promising to help them "every step of the way," but they haven't heard from the company since.
    • It's like Microsoft hasn't learned anything from Internet Explorer fiascos. Or they weren't slapped hard enough financially for it...
    • Yes they're payroll taxes with some of it linked to share-based compensation for employees. So when the stock price was rising in q2 these charges also increased.
    • Stopped using paypal as much as I possibly can after the whole Honey mess. Their entire business model essentially is to be a trustworthy middleman and they lost all of it by deciding to do shady things without telling the users. Well done Paypal.
    • I need someone to explain to me what "passkey" is and what happens if my device crashes and is not recoverable.
  • Recent Achievements

    • Apprentice
      MikeK13 went up a rank
      Apprentice
    • Week One Done
      andeyhawk65 earned a badge
      Week One Done
    • First Post
      Jake2530 earned a badge
      First Post
    • Explorer
      Deranox went up a rank
      Explorer
    • Week One Done
      John Volks earned a badge
      Week One Done
  • Popular Contributors

    1. 1
      +primortal
      686
    2. 2
      ATLien_0
      259
    3. 3
      Xenon
      178
    4. 4
      neufuse
      135
    5. 5
      +FloatingFatMan
      100
  • Tell a friend

    Love Neowin? Tell a friend!