Click on image to change chosen plugin item - javascript

I'm working on a layout for a product using hikashop in joomla. example page can be seen here: product page. The characteristics select box is using the Chosen plugin. What I am trying to accomplish is to have the thumbnail images below change the selected item in the select box like this:
<img id="hikashop_product_characteristic_35"
onclick="document.getElementById('hikashop_product_characteristic_19').value='35';"
class="hikashop_child_image"
src="/zink/media/com_hikashop/upload/nbg_blackstealth_1061075554.png"
alt="hikashop_child_image_35">
Well if this was working, clearly I wouldn't be posing here. I think the chosen plugin overrides the select box, and i dont know enough about this to work around, so any help would be appreciated.
#isherwood - I tried your example and am getting UncaughtSyntaxError: Unexpected Token ;
Not too sure where my error is, here is my entire code block:
foreach($this->element->variants as $variant){
foreach($variant->characteristics as $k => $characteristic){
$char_id = $characteristic->variant_characteristic_id;
$cat_id = $k;
}
foreach($variant->images as $image){
echo '
<img id="hikashop_product_characteristic_'.$char_id.'" class="hikashop_child_image" src="' . $this->image->uploadFolder_url . $image->file_path . '" alt="hikashop_child_image_' . $char_id . '" />'; ?>
<script>
char_id = '<?php echo $char_id ?>'
</script>
<?php
}
} ?>
<script>
$('img.hikashop_child_image').click(function() {
$('#hikashop_product_characteristic_19').val(char_id);
}
</script>

After you set your select value, you need to update Chosen:
$("#hikashop_product_characteristic_14_chzn").trigger("chosen:updated");
http://harvesthq.github.io/chosen/#change-update-events
Indicentally, you're using jQuery, so
document.getElementById('hikashop_product_characteristic_19').value='35'
can simply be
$('#hikashop_product_characteristic_19').val('35');
This would all be better done with a single click event listener rather than inline onclick handlers.
$('img.hikashop_child_image').click(function() {
...
}

Related

how to put output php on a specic place

I have made two divs besides each other, the left div contains a list of names and in the right one is empty.
The names in the left div are generated from a database, also it's wrapped into a a tag so I can click on it.
echo "<a href='Overview.php?id=" .$row['ID'] . "'>" .$row['COMPANY']." </td> <br>";
When somebody clicks on the a tag it will generate a new variable: id in the browser link.
Now my main goal is to get this $row['ID'] variable into the right div.
What I tried (php function):
If the ID is set (= somebody clicked on the a tag) it will echo the id. But I have no clue how to place this into the right div (#rightcolumn)
function runMyFunction() {
echo $_GET['id'];
}
if (isset($_GET['id'])) {
runMyFunction();
}
Thank you for reading!
so call your function in right div
<div id="rightcolumn"><?php if(isset($_GET['id'])) {runMyFunction();}?></div>
Someone already posted a solution for PHP.
But you can also consider using JQuery and fire an on click event :
<div class="container">
<div class="left">
Name1<br>
</div>
<div class="right">
</div>
</div>
JQuery:
$('#Id1').on('click', function(){
var id = $('#Id1').attr('id');
$('.right').text(id);
});
Use Jquery or javascript
echo "$('#rightcolumn').html(".$_GET['id'].");";
or
echo "document.getElementById('rightcolumn').innerHTML = ".$_GET['id'].";";

JS Not firing on click

I am trying to load the function call_ajax_add_to_quotelist via the button with the following code:
$cartlink .= '<a class="add_to_cart button alt" href="javascript:void(0);" onclick="call_ajax_add_to_quotelist(add_to_quotelist_ajax_url,'.$product->id.');" '.$style.'>'.$label.'</a>';
The code above is loading fine on the view source however when clicked it is showing dead with no console error I have loaded the js file in the function (It belongs to another plugin I am hacking a WP plugin with the same actions of another plugin)
Script Load:
$quotePluginJSUrl = site_url().'/wp-content/plugins/dvin-wcql/js/dvin_wcql.js';
?>
<script src="<?php echo $quotePluginJSUrl; ?>"></script>
<?php
I would a t first check, if call_ajax_add_to_quotelist is really a function in JavaScript Console, and if add_to_quotelist_ajax_url is a correct value.
Also, it is recommended to not use onclick. I recommend using jQuery event binder .on().
Expl.:
<?php
$cartlink .= "<a class='add_to_cart button' data-id='{$product->id}'
href='javascript:;' {$style}>{$label}</a>";
// ... more products
?>
// **one** <script> after all products
<script>
jQuery(window).on('click', '.add_to_cart.button', function() {
call_ajax_add_to_quotelist(add_to_quotelist_ajax_url, $(this).data('id');
}
</script>
Close the anchor
<a>...</a>
because you are adding the anchor dynamically, you need to use .addEventListener if you're using JS or Event Delegation if you're using jQuery
e.g.
$('.button').on('click',function(){
call_ajax_add_to_quotelist(add_to_quotelist_ajax_url,'.$product->id.');
});
Plus you haven't closed the anchor tag in your code which might cause you some problems:
$cartlink .= '<a class="add_to_cart button alt" href="javascript:void(0);" '.$style.'>'.$label.'</a>'

How set id from database to php session on link click

but lets talk from the begin. I am creating website similar like wordpres blog index page (can't show picture bescause dont have enough reputation). And then I click read more link in the intro article I want save that article id from the database to php sesions. Here is the code.
while($row = mysqli_fetch_array($result))
{
echo '<div class="img">
<img src="img/smiley.gif" alt="Smiley face" width="250" height="250">
</div>';
echo "<h2>".$row['Name'] . "</h2> " ;
$string = strip_tags($row['Content']);
if (strlen($string) > 500) {
$stringCut = substr($string, 0, 500);
$string = substr($stringCut, 0, strrpos($stringCut, ' ')).'... Read more';
}
//echo $string;
if(isset($_GET['link']) /*you can validate the link here*/){
$_SESSION['link']= true;
}
echo $string;
echo "<br>";
echo '<div class="content dashboard clearfix"></div>';
echo '<hr>';
}
mysqli_close($con);
?>
So I have 3 intro articles in index.php file and I whant read one, so I press READ MORE (then I should write article id to session) and go to other page, were I think I should get articles id from session. I am tryyng do it with
if(isset($_GET['link']) ){ /*you can validate the link here*/
$_SESSION['link']= true;
}
But it always write number 5 the last ID from database, so I think I should use maybe AJAX, javascript?? Maybe some one can give me the example?
Thank you.
You could set a SESSION variable through ajax but... that'd get pretty insane, making things overly complicated and not very SEO friendly
There's a better method: Make your "read more" actual links to your content. So you've got a "read more" link to http://example.com/page.php?id=5, then inside "page.php" you simply do:
$Id = intval($_GET['id']);
You can make this more pretty after reading how to create friendly URL in php? so they look like http://example.com/page/5.
From your code, you automatically go to the desired page when clicking on the link. Therefore, you only need to create the page post.php and retrieve a single row from the database, in a similar fashion as I indicated above but with the proper name:
$Id = intval($_GET['link']);

PHP link written into page not being retrieved by a JAVASCRIPT function

I'm writing on a page the following code with PHP. This code creates a A HREF link with the ID equal to $intIdType, which is the value of the PRIMARY KEY in a database, and $count gets the amount of records per category on the database. All of this is inside a WHILE that reads each record and writes on the PAGE the results
echo "<a href='#' id='$intIdType'>";//Starts creating the link
echo "$intIdType -";
echo $arrBusinessTypes["business_Description"];
echo "(";
echo " $count1 )"."</a>";
Now, after the results are on the page it will look like this:
$intIdType $arrBusinessTypes $count
--------------------------------------------
1 -Auto Sales ( 1 )
2 -Auto Repair ( 1 )
5 -Web Desig & I.T. Services( 2 )
6 -Computer Shop ( 1 )
The above result displays each rown as a link where I can click on it, but nothing happens. Even just a simple Alert in javascript does not show up. It seems that it never reaches even the Javascript at all.
What I need now is to retrieve that PHP generated code on the page by a Javascript file, that will allow me to use the hiperlink generated by PHP into the .HTML page
It works if I write directly into the page what PHP is suppose to write. I wonder if this happens because Javascript can not read posted data from PHP into the page.
The Javascript File looks like this:
window.onload=post_result
function post_result() {
$("#1").click(function() { //This is the HREF ID that is written by PHP into the page
$('#list_results').load("results.php");//This seeks to run a PHP file in a DIV
$('.title').text('Listing Categories');//This just replaces the Title in the page
})
I'm just a beginner trying. Thanks for any help.
echo "<a id='$intIdType'>";//Starts creating the link echo "$intIdType -";
echo "$intIdType -";
echo $arrBusinessTypes["business_Description"];
echo "("; echo " $count1 )"."</a>";
just remove href attribute and try
Remark #1: quote custom data when outputs it to HTML:
echo $arrBusinessTypes["business_Description"]; must be
echo htmlspecialchars($arrBusinessTypes["business_Description"]);
Remark #2: you don't need window.onload handler here. In this piece of code you select complex way to do simple thing. Why do not write direct onclick handler? Write function loading some data depending of parameter and do something like:
$htmlspecialchars = function($s){return htmlspecialchars($s);};
echo <<<HTML
<a href='#' id='$intIdType' onclick='loadInfo($intIdType)'>
$intIdType -{$htmlspecialchars($arrBusinessTypes["business_Description"])} ( $count1 )
</a>
HTML;
(converted to heredoc to make HTML more clean)

href call in javascript

I have a problem with using , during
click of the link, I need to update a field in the database and redirect to another page after.
I have this code:
<a href="#" onclick="<?php
$sql="UPDATE MyDB.mytable SET Date = '".date("Y-m-d H:i:s")."'
WHERE ID='" . $id . "'";
if (!mysql_query($sql)) ///Cannot query
{
$logger->error(mysql_error());
}
if ($sql)
{
$logger->debug('OK');
}
else
{
$logger->debug( 'NOt OK');
}
?>"> </a>
After the php end tag '?>' can I add my path to be directed to? like:
<a href="#" onclick="<?php
$sql="UPDATE MyDB.mytable SET Date = '".date("Y-m-d H:i:s")."'
WHERE ID='" . $id . "'";
if (!mysql_query($sql)) ///Cannot query
{
$logger->error(mysql_error());
}
if ($sql)
{
$logger->debug('OK');
}
else
{
$logger->debug( 'NOt OK');
}
?> ../index.php"></a>
Is that even possible?
What is the right thing to do it?
Thanks a lot!
this is not the right way.
There can be multiple ways you could take to do this. But I'd suggest you to place the DB update code in the target page (that I assume you mentioned as index.php). If you only want to trigger the DB update code on clicking of the link, use a page in middle to redirect the flow.
So, your page flow will be:
Current Page (Link Clicked, simple href to middleman.php) ==> middleman.php (just run the DB update code here and use header Location syntax to index.php) ==> index.php
codes:
page in which you have the link
source.php
<.... html contents ....>
<a href='middleman.php'>Visit the page</a>
<.... more html contents ....>
middleman.php
<?php  
$sql="UPDATE MyDB.mytable SET Date = '".date("Y-m-d H:i:s")."' WHERE ID='" . $id . "'";
if (!mysql_query($sql)) ///Cannot query
{
$logger->error(mysql_error());
}
if ($sql)
{
 $logger->debug('OK');
}
else
{
 $logger->debug( 'NOt OK');
}
header("Location: index.php"); //redirects to index.php
?>
index.php
do whatever you want
When a page is rendered, php code will run once. Whenever you see a webpage, it's only html, always, with no live access to the php code. So, you cannot execute php blocks directly from for example a javascript event. In your case the sql query would execute once, when you load the page.
kishu27 just posted one of the proper ways to do it, and the best option for you in this case. If you only wanted to update the database, without being redirected to another page, an ajax call to a php page with the database code would be a good alternative.
Using location.pathname

Categories

Resources