Solved

How do I modify Joomla component to remove a line on the displayed form?

Posted on 2014-11-17
14
110 Views
Last Modified: 2014-11-19
Here is the url.

http://domgarofalo.com/collegekids

username: Expert
password: Windows1

I need size " infant 0-3" taken off ONLY the following:

- ruffle tee
- short sleeve tee
- girlie tee
- crew
- zip hood
- varsity cardi
- sweat pant

After you login, click Place Order, click Add Items, and click Infant.
There are 4 MVP body suits to choose from. I want to remove the
size 0-3 on each one.

I can't get a hold of the creator of the component and I have
checked all the documentation to no avail. The name of the
component is JoomeSuite. If you need ftp access, let me know.
This is not the actual site, it is a demo. Once I find the solution, I
will apply it to the actual site.

Thank you.
0
Comment
Question by:domgarofalo
  • 8
  • 6
14 Comments
 
LVL 14

Expert Comment

by:CtrlAltDl
ID: 40447864
I know you could hide the infant selections with:
$('[id=infant]').hide();

Still looking into how to determine which items to hide it for...
0
 
LVL 14

Expert Comment

by:CtrlAltDl
ID: 40447867
Instead of hiding "infant" wouldn't we just want to hide those items after Infant has been selected?
0
 
LVL 14

Expert Comment

by:CtrlAltDl
ID: 40447926
Is the Image "alt" the unique product ID?  If so it looks like that would be the best thing to use for a selector.
//Check if infant has been selected.
if ($('#infant').is(":visible") )
{
     //Hide the Ruffle Tee (Product ID: 14321)
     $('img[alt="14321"]').hide();
}

Open in new window

0
Master Your Team's Linux and Cloud Stack!

The average business loses $13.5M per year to ineffective training (per 1,000 employees). Keep ahead of the competition and combine in-person quality with online cost and flexibility by training with Linux Academy.

 

Author Comment

by:domgarofalo
ID: 40447949
If you go to the order form. There is a paragraph on top that say which items are not available in that size anymore. I think the alt is the unique product ID. We could hide it that way then?
0
 
LVL 14

Expert Comment

by:CtrlAltDl
ID: 40447988
Yup, you can hide an image with the alt tag (see my code above).

FYI, if you search with nothing the textbox the error has a misspelling for "search" ("Please enter a name to serach for.").
0
 
LVL 14

Accepted Solution

by:
CtrlAltDl earned 500 total points
ID: 40448015
Now the trick is to have it hide those elements when the Infant items are shown.

This code must run when the page is loaded.
//Trigger the infantSelected() function when infant is selected
$('#infant').bind('isVisible', infantSelected);

Open in new window


This function is called when infant is selected.
function infantSelected()
{
     //Hide the Ruffle Tee (Product ID: 14321)
     $('img[alt="14321"]').hide();
     //Hide the Short Sleeve Tee (Product ID: 10801)
     $('img[alt="10801"]').hide();
     //Add the rest of the items below.
}

Open in new window

0
 

Author Comment

by:domgarofalo
ID: 40449005
Not to sound like a total newb, but which file do I add this to? Is this part of the php or JQuery? Thanks!
0
 

Author Comment

by:domgarofalo
ID: 40450276
I can give you access to the files if you need it.
0
 
LVL 14

Expert Comment

by:CtrlAltDl
ID: 40451060
That code needs to be added inside of the php file within a script tag.  Preferably within an existing one.
<script>
function infantSelected()
{
     //Hide the Ruffle Tee (Product ID: 14321)
     $('img[alt="14321"]').hide();
     //Hide the Short Sleeve Tee (Product ID: 10801)
     $('img[alt="10801"]').hide();
     //Add the rest of the items below.
}
</script>

Open in new window


And this jQuery code should be added to the jquery $(document).ready() function, which appears to be within the joomsuite add-on.

		$(document).ready(function() {
			if(type == "Customer"){
				selectCustomer("E1278 Wesley J Cuebas");
			}
			
			//Check if infant has been selected.
			if ($('#infant').is(":visible") )
			{
			     //Hide the Ruffle Tee (Product ID: 14321)
			     $('img[alt="14321"]').hide();
			}
		});

Open in new window

0
 

Author Comment

by:domgarofalo
ID: 40452379
I'm trying to find where to add the second part and I can't seem to find it.
0
 
LVL 14

Expert Comment

by:CtrlAltDl
ID: 40452744
Do you have a text editor (I use Notepad++) or IDE (Visual Studio, etc.) that can search a whole subdirectory for text?  If so you can do a search for $(document).ready.
0
 

Author Comment

by:domgarofalo
ID: 40452931
I was able to find it by opening all of the .js files in the component folder and searching for the string. I don't think I placed the code in the correct spots through. Could you check. Here is the admin access to the site. The site is in the collegekids folder.

http://domgarofalo.com/collegekids/administrator

admin
Windows1

There is an ftp component called eXtplorer under the Extend menu that will give you access to the files.

This is a test site so you don't need to worry about being in there. I added the first block of code to the following file starting at line 34.

components-->com_joomsuite-->views-->placeorder-->tmpl-->default.php

I added the second block of code to the following files starting at line 33.

components-->com_joomsuite-->assets-->js-->place_order.js.php

Thanks for the help.
0
 
LVL 14

Expert Comment

by:CtrlAltDl
ID: 40453109
Ok, I removed the code from tmpl->default.php, and just added everything to the place_order.js.php.

Then I just added the code to hide those items in the $('#infant').click() event starting on Line 111.
0
 

Author Comment

by:domgarofalo
ID: 40453244
You are awesome! Thank you!
0

Featured Post

Master Your Team's Linux and Cloud Stack!

The average business loses $13.5M per year to ineffective training (per 1,000 employees). Keep ahead of the competition and combine in-person quality with online cost and flexibility by training with Linux Academy.

Question has a verified solution.

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

Suggested Solutions

Building a website can seem like a daunting task to the uninitiated but it really only requires knowledge of two basic languages: HTML and CSS.
3 proven steps to speed up Magento powered sites. The article focus is on optimizing time to first byte (TTFB), full page caching and configuring server for optimal performance.
In this tutorial viewers will learn how to style transparent/translucent elements using alpha transparency in CSS Start with a normal styled element, such as a div.: Define its "background-color" property as "rgba (255, 255, 255, .5): The numbers in…
In this tutorial viewers will learn how to style a decorative dropcap for the first letter in a paragraph using CSS. In CSS, create a new paragraph class by typing "p.fancy": Then, to style only the first letter of the first sentence, include the ps…

770 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