Jump to content

Problem with Search Box


Recommended Posts

I've been playing with the search button and session buttons and moved them by adding in a top position into the global/index.tpl.

I was using this CC forum thread as a guide: http://www.cubecart.com/site/forums/index....c=12011&hl=

The login and register button seems to work fine, but not the search box.

Here is the code for the global/index.tpl code:

</head>

<body>

<div id="pageSurround">

<div id="subSurround">

<div id="topHeader">

<div style="position:relative;left:0px;top:210px;float:left">{SEARCH_FORM}</div>

<div style="position:relative;right:0px;top:210px;text-align:right">{SESSION}</div>

</div>

By adding the top:210px; The buttons move down to where I want them, but when the search text box goes outside of the header box you cannot type into the search box. Move it back up into the header and viola, it works.

I see by the code that the {search_form} is in the top header div tags, but if I move them outside the tags, my pages gets real screwey.

My site is :www.wildwestfab.com/catalog

Does anyone have any ideas?

CCV3 with Marks Legend Full Screen

Edit: Hmmm.. been playing with it and now my register page is not right either.

Edit x2: Fixed the register page, that was a .tpl error.

Link to post
Share on other sites

OK, I can get the search button on the same line under the header, but I can't type in the search box. However if I seperate the search and session boxes by one line in height, the search box functions fine.

Here is my index.tpl and cart.tpl code

<div id="topHeader">

<div style="position:relative;left:0px;float:left;text-align:right;top:210px;">{SEARCH_FORM}</div>

<div

style="position:relative;right:0px;text-align:right;top:210px;">{SESSION}</div>

</div>

Can anyone help? :huh:

Edit: Once I fixed the session error, the session box work fine. It's just the search box that doesn't work.

Link to post
Share on other sites
Guest groovejuice

@TEL, your code is a bit of a rat's nest :rolly:

The reason you cannot type into the text box is because your nested div is extending below the parent onto the following div, which has a higher inherent z-index. Simple fix is to add

z-index:100;

to the div with the search box. 

Better is to replace


<div style="position:relative;left:0px;float:left;text-align:right;top:210px;">{SEARCH_FORM}</div>

with


<div style="position:relative;left:0px; top:210px;">{SEARCH_FORM}</div>

Best is to create unnested div below the header.

Link to post
Share on other sites

Thanks for the reply Gjuice!

@TEL, your code is a bit of a rat's nest :rolly:

Yes, it is.... I am not much of a code person, so I just stumble through it with whatever makes sense to my pea-brain. :D

The reason you cannot type into the text box is because your nested div is extending below the parent onto the following div, which has a higher inherent z-index. Simple fix is to add

z-index:100;

to the div with the search box. 

Better is to replace


<div style="position:relative;left:0px;float:left;text-align:right;top:210px;">{SEARCH_FORM}</div>

with


<div style="position:relative;left:0px; top:210px;">{SEARCH_FORM}</div>

When I add that to my code, the search button does work, but the sessions button is one line below it (or should I say they are no longer aligned to one another).

Best is to create unnested div below the header.

Can I do that without having the border on that particular nest? The CC thread I mentioned above adds the search and session button to a new box just below the top header, but to me it looks cluttered, I would rather not see the extra box border.

Link to post
Share on other sites
Guest groovejuice

I haven't checked, but this code should work cross browser.

<DIV id=topHeader></DIV>

<DIV style="margin-top:-20px;">

<DIV style="FLOAT: left; margin-left:10px;">

<FORM action=index.php method=get>

<SPAN class=txtSession><STRONG>Search for:</STRONG></SPAN>

 <INPUT class=searchBox id=searchStr name=searchStr>

 <INPUT type=hidden value=viewCat name=act> 

<INPUT class=searchBtn type=submit value=Go name=Submit>

</FORM>

</DIV>

<DIV style=" float:right;margin-right:10px;">

<SPAN class=txtSessionGrey>Welcome Guest</SPAN>

 <SPAN class=txtSession>[</SPAN>

<A class=txtSession href="http://www.wildwestfab.com/catalog/index.php?act=login&redir=L2NhdGFsb2cvaW5kZXgucGhw">Login</A> 

<SPAN class=txtSession>|</SPAN>

 <A class=txtSession href="http://www.wildwestfab.com/catalog/cart.php?act=reg&redir=L2NhdGFsb2cvaW5kZXgucGhw">Register</A>

<SPAN class=txtSession>]</SPAN>

</DIV>

</DIV>

<DIV style="clear:both;"> </DIV>

Link to post
Share on other sites

Thanks GJuice, That got rid of it; it also got rid of the header sides too, but I don't know if that will be a problem, I'll get my header finished and post it and see it it'll will cause any problems.

Thanks again, it was great to have the detailed help! :)

Tim

Link to post
Share on other sites
Guest groovejuice

You're welcome! I think your modified css does not have background properties for the topHeader div -just add the additional code:

border: 1px solid #hexdecvalue;

where hexdecvalue is #000000 for black, #FFFFFF for white, or any value in between

Link to post
Share on other sites

You're welcome! I think your modified css does not have background properties for the topHeader div -just add the additional code:

border: 1px solid #hexdecvalue;

where hexdecvalue is #000000 for black, #FFFFFF for white, or any value in between

The topheader had a border value, but it was a border-bottom, hence that's all that was shown. Shortened it to border and viola! it is perfect. What was that about not being able to see the forest for the trees? :)

Thanks again Gjuice... it works fine now! B)

Link to post
Share on other sites
  • 3 weeks later...

I haven't checked, but this code should work cross browser.

<DIV id=topHeader></DIV>

<DIV style="margin-top:-20px;">

<DIV style="FLOAT: left; margin-left:10px;">

<FORM action=index.php method=get>

<SPAN class=txtSession><STRONG>Search for:</STRONG></SPAN>

 <INPUT class=searchBox id=searchStr name=searchStr>

 <INPUT type=hidden value=viewCat name=act> 

<INPUT class=searchBtn type=submit value=Go name=Submit>

</FORM>

</DIV>

<DIV style=" float:right;margin-right:10px;">

<SPAN class=txtSessionGrey>Welcome Guest</SPAN>

 <SPAN class=txtSession>[</SPAN>

<A class=txtSession href="http://www.wildwestfab.com/catalog/index.php?act=login&redir=L2NhdGFsb2cvaW5kZXgucGhw">Login</A> 

<SPAN class=txtSession>|</SPAN>

 <A class=txtSession href="http://www.wildwestfab.com/catalog/cart.php?act=reg&redir=L2NhdGFsb2cvaW5kZXgucGhw">Register</A>

<SPAN class=txtSession>]</SPAN>

</DIV>

</DIV>

<DIV style="clear:both;"> </DIV>

Groovejuice are you still willing to give a little help? :D

This coding has been working great except for the login function. When you log in, the page will still show "Welcome Guest" it does not say "Welcome Jon Doe" nor does it offer you the "log out" or "your account buttons". If you click on it again, it will say Already Logged In.

Do you have any ideas on what to do to enable that part of the log in?

Thanks in advance,

Tim

Link to post
Share on other sites
Guest groovejuice

@ TEL, I created a new user and have logged in in FF, IE7 and IE6. All browser are displaying the correct messages to the customer in the log-in box.

Try clearing your cache and cookies. There can be issues with sessions, so it's possible this is all you need to do.

Link to post
Share on other sites

Thanks for looking Groovejuice, unfortunately by the time you looked I had reverted it back to a prior back-up, trying to figure out when this went wrong and where. :D

It is pretty much the same problem I had with the search box not operating properly unless it was in the header. Once it is moved below the header, it isn't working correctly.

I moved it back to the place where it is having problems.... Can I ask you to check it again??? :D

Thanks again,

Tim

Link to post
Share on other sites
  • 5 months later...
Guest karaokeking

Thanks to this post I am happy as a bee...

I changed index.tpl in global to

<div style="z-index:100;position:relative;left:200px;float:left;text-align:right;top:14px;">{SEARCH_FORM}</div>

<div style="z-index:50;position:relative;right:0px;text-align:right;top:14px;">{SESSION}</div>

HotStuffonline

I love CubeCart

Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...