Member Avatar for ankit.baphna

Hi,

I want to create list of items on my header to which if selected sends that value to my Div class where my search code is there as input to it.

I have seen href works for pointing to.php with id value as parameter. but what is syntax for pointing to div class with parameter value.

my href would look like this but this doesn't work: 
<a href=#hovergallery?var="furniture">furniture</a>

my div class is:
<div class="hovergallery" id="hovergallery">
    <?php

                        include('connection.php');
                        $ecategory_search=$_GET['id'];
....

Kindly send me href syntax for it.

Regards,
Ankit

  • 4 Contributors
  • 9 Replies
  • 270 Views
  • 1 Day Discussion Span
  • Latest Post Latest Post by pixelsoul

Dani AI

Generated

Short answer: a plain fragment link (the part after #) cannot send a parameter to the server by itself. Two practical options are available: 1) make a normal page request with the query string and add the fragment to jump to the DIV; or 2) use JavaScript/AJAX to fetch results and inject them into the DIV without reloading. As and noted, the JS route is required for in-place updates; ’s dropdown worked because the form submit sent real GET/POST data to the server.

Correct (full-page) request example — query before fragment:

<a href="index.php?category=Furniture#hovergallery">Furniture</a>

The server will receive category=Furniture and the browser will then scroll to #hovergallery. Do not put ? inside the fragment (for example #hovergallery?…) — that makes the whole thing a client-side fragment and the server never sees the query.

AJAX option (updates the DIV without reload). HTML links carry the category in a data attribute; a small jQuery handler requests the server endpoint and replaces the DIV contents:

<a href="#" class="cat-link" data-category="Furniture">Furniture</a>

<script>
$(document).on('click', '.cat-link', function(e){
  e.preventDefault();
  var cat = $(this).data('category');
  $.get('search.php', { category: cat }, function(html){
    $('#hovergallery').html(html);
    location.hash = 'hovergallery'; // optional: jump to div
    history.replaceState(null,'','?category='+encodeURIComponent(cat)+'#hovergallery');
  }).fail(function(){ console.error('request failed'); });
});
</script>

Troubleshooting notes: use the browser DevTools Network tab to see the exact URL being requested (incorrect quoting in href caused the “Forbidden” error seen earlier). Ensure the server script expects the same parameter name used in the request, return only the HTML fragment intended for insertion, and sanitize server output before injecting it. A recommended workflow: verify the server response with a full-page query first, then replace that request with the AJAX call for smooth UX.

Recommended Answers

All 9 Replies

Member Avatar for pritaeas

You'll need Javascript/jQuery to achieve what you need IMO. Am I right, that if you click the link you want to prefill a textbox with "furniture"?

Member Avatar for ankit.baphna

list would be displayed like : furniture cosmetics interior

if user cicks on furniture in backend code this selection goes as input to my search query and it displays picture of furniture shops. it will dsplay images at bottom of page where my DIV is placed.
I was able to do same with dropdown menu bar but I thought displaying list on top would be easier for my user than drop down.

Member Avatar for ankit.baphna

href: is it not possible to use reference to DIV as well as pass variable through it?

Member Avatar for ankit.baphna

if I use this syntax it gives me error saying no access on your server
Syntax:
<a href=\"#_hovergallery?id=Furniture\">Furniture</a></p>

output:
http://localhost/%22#_hovergallery?id=Furniture\"

Forbidden
You don't have permission to access /" on this server.

If I user this syntax
<a href="#hovergallery?id=Furniture\">Furniture</a></p>
it goes to no where

Edited by ankit.baphna
Member Avatar for pritaeas

href: is it not possible to use reference to DIV as well as pass variable through it?

Not possible. A DIV is a HTML block and cannot accept parameters like a script can. You'll need to use Javascript/jQuery/AJAX.

Member Avatar for ankit.baphna

thanks,
I am not very familiar with javascripts can someone give code for it.

Member Avatar for ankit.baphna

but if I pass value through drop down selection within form action then DIV is receiving value and able to run my search query.
so why is that through href its not possible. drop down and href both are html syntax.

Member Avatar for pixelsoul

You can bind an ajax call on the selector of your choice with the event of your choice. Using jQuery helps stream line the code for making a call with AJAX to your script that runs the query, then returns the results back to the page, in the div, table, whatever you choose.

You're going to have to do a little reading and experimenting to get started.

http://api.jquery.com/jquery.ajax/

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.