Solved

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

Posted on 2014-11-17
14
107 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
Comment Utility
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
Comment Utility
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
Comment Utility
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
 

Author Comment

by:domgarofalo
Comment Utility
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
Comment Utility
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
Comment Utility
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
Comment Utility
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
How your wiki can always stay up-to-date

Quip doubles as a “living” wiki and a project management tool that evolves with your organization. As you finish projects in Quip, the work remains, easily accessible to all team members, new and old.
- Increase transparency
- Onboard new hires faster
- Access from mobile/offline

 

Author Comment

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

Expert Comment

by:CtrlAltDl
Comment Utility
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
Comment Utility
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
Comment Utility
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
Comment Utility
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
Comment Utility
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
Comment Utility
You are awesome! Thank you!
0

Featured Post

How your wiki can always stay up-to-date

Quip doubles as a “living” wiki and a project management tool that evolves with your organization. As you finish projects in Quip, the work remains, easily accessible to all team members, new and old.
- Increase transparency
- Onboard new hires faster
- Access from mobile/offline

Join & Write a Comment

Introduction If you're like most people, you have occasionally made a typographical error when you're entering information into an online form.  And to your consternation, the browser remembers the error, and offers to autocomplete your future entr…
This article discusses four methods for overlaying images in a container on a web page
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…
The viewer will receive an overview of the basics of CSS showing inline styles. In the head tags set up your style tags: (CODE) Reference the nav tag and set your properties.: (CODE) Set the reference for the UL element and styles for it to ensu…

772 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

Need Help in Real-Time?

Connect with top rated Experts

11 Experts available now in Live!

Get 1:1 Help Now