• I’m looking for a way to have an image change to a different image when a user clicks on it, for use within the WP-Table Reloaded.

    Most people seem to use javascript for this, but I’m not sure how I could integrate that into my WordPress site where I am only using WP-Table Reloaded on one page. Obviously I wouldn’t want javascript in the HEAD of each page…

    Any suggestions for this? Your help would be GREATLY appreciated!

Viewing 6 replies - 1 through 6 (of 6 total)
  • Plugin Author Tobias B?thge

    (@tobiasbg)

    Hi,

    thanks for your question.

    I would do it in the following way:
    Simply wrap the inclusion of the JavaScript file into a

    is_page ( array( 'your-page-slug' ) ) {
      // load JavaScript here
    }

    That way, your code will only be loaded if you are on the page with the table (which would be “your-page-slug” in my example).

    Another idea would be to simply paste the HTML for loading the JavaScript below the table (you will need to use the “HTML editor” instead of the “Visual editor” on the WordPress Edit screen of the page).

    Best wishes,
    Tobias

    Thread Starter kerer

    (@kerer)

    Hi Tobias,

    Thank you. I tried your second idea, which is easier to integrate, and I ended up with some strange behavior with the script; the image would change only sometimes and sometimes the only image that would change would be the first one in a row, but not in other subsequent rows. So unless I did something really funny, I’m pretty sure it doesn’t work correctly.

    The first idea you suggest is a little Greek to me. I don’t think I’m understanding it fully – I’m not a great programmer. Would you mind elaborating?

    I want this to work and like your plugin a lot. You have my word that I will make a donation either way. ??

    Thanks!!!

    Plugin Author Tobias B?thge

    (@tobiasbg)

    Hi,

    the first solution requires some knowledge on WordPress plugin development, i.e. action hooks and filters. But the second solution is actually better, so don’t worry about it ??

    It is hard to say anything specific without knowing the code that we are talking about. Can you therefore post the URL to the page with your table, where your JavaScript is not working properly?

    Thanks!
    Tobias

    Thread Starter kerer

    (@kerer)

    Hi Tobias,

    Ha ha, well at least your advice about using the easier second solution is good news!

    Here is the url: https://www.paidsurveysuk.com/surveys-worksheet/

    Thanks again for your help.

    Plugin Author Tobias B?thge

    (@tobiasbg)

    Hi,

    ok, thanks for the link.

    Your JavaScript code contains a little problem: You are accessing the image by ID and you gave all images the same ID. This however will not work, because IDs must be unique throughout the page. So, each image will need a different ID.
    However, then you won’t know which image was clicked, because you are not adding it as a parameter to the “changeimage()” call.
    So, what you should try: Give each image a different id, like “myimage1”, “myimage2”, and so on. In the “onclick” handler, use something like “changeimage(‘myimage1’);” as well, where the parameter is the same as the ID. Then, in the actual JavaScript function, use that parameter to change the image, instead of hardcoding it.

    If that does not work, I’m afraid that you should ask in a more JavaScript related forum, e.g. in the jQuery forum.

    Regards,
    Tobias

    Thread Starter kerer

    (@kerer)

    Hi Tobias,

    Thanks again for your help. I tried modifying the code using your suggestions above but I couldn’t get it to work. I also tried various other code snippets and they didn’t work either.

    Anyway, thanks very much for your suggestions and for creating a great wp table plugin! ??

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘[Plugin: WP-Table Reloaded] OnClick Image Change’ is closed to new replies.