Posts

Showing posts with the label jquery

search for custom post on AJAX response in WORDPRESS

search for custom post on AJAX response in WORDPRESS I search for a post with certain $value in posts of custom post type with custom field in AJAX response. Custom field is provided by ACF plugin. When button is clicked then AJAX request is send and posts are searched through. If custom_field of a post equals $value then I get id of that post if $value doesn't exist in any of custom posts then post is created and I get id of newly created post. Every post of custom_post contains custom_field . When I refresh page it works and post is not created for second time after second click. Otherwise the another click doesn't find a post so it is created again. I don't know why refresh helps. $value custom_field $value id $value id custom_post custom_field In content-page.php I call a function from my functions.php that generates links with: content-page.php functions.php jQuery(document).ready(function($) { jQuery( "body" ).click(function( event ) { v...
Post a Comment
Read more

Draggable and Record Marker Location Google Map Api

Draggable and Record Marker Location Google Map Api here I have a map, in my map, I want to make a marker there can be draggable. When i drag and drop the marker i want it make a record or just change my value of my input. here my script : var iconBase = 'https://maps.google.com/mapfiles/kml/shapes/'; var icons = { parking: { icon: iconBase + 'parking_lot_maps.png' }, library: { icon: iconBase + 'library_maps.png' }, info: { icon: iconBase + 'info-i_maps.png' } }; var locations = [ ['location 1', -33.80010128657071, 151.28747820854187, 2,"info"], ['location 2', -33.950198, 151.259302, 1,"info"] ]; var map = new google.maps.Map(document.getElementById('map'), { zoom: 11, center: new google.maps.LatLng(-33.92, 151.28747820854187), mapTypeId: google.maps.MapTypeId.ROADMAP }); var infowindow = new google.maps.InfoWindow(); var marker, i;...
Post a Comment
Read more

Reset/Submit button won't work once text area is edited by user?

Reset/Submit button won't work once text area is edited by user? My form's reset and submit buttons do not work when I edit the output of the form in the textarea. I created a form that outputs custom sentences based on user inputs. If I don't edit the textarea these buttons work fine, resetting or resubmitting onclick. However, if I edit the textarea all functionality seizes. Any ideas? Thanks! <3 <!DOCTYPE html> <html> <head> <title>Experiment</title> <style type="text/css"> table,td,th{ margin-left: auto;margin-right: auto } .display{ display: flex;align-items: center;justify-content: center; } p{ text-align: center; } textarea{ display: block;margin-left:auto;margin-right: auto; } </style> function sentence(){ document.getElementById("s1").style.display= 'block'; document.getElementById("r1").style.display= 'blo...
Post a Comment
Read more

Dynamic select2 options using api

Dynamic select2 options using api I'll try to explain my problem as much as I can. I am trying to create, with select2 plugin, a way for the user to write some letters and on each letter pressed a call to an API that gives the first 20 results given by that API. select2 So I have my HTML select : <select name="filtre_products" class="form-control products-select2" multiple> </select> And then my JS (it's commented) : $(".products-select2").select2({ width: '100%', closeOnSelect: false, placeholder: '', minimumInputLength: 3, query: function (query) { var data = {results: }, i, j, s; if(query.term != null) { var ajax_r = ; $.ajax({ url: 'ajax_products_recherche.php?limite=10&real_json=1&recherche='+query.term, success: function(data_a){ //Getting the data data_a = JSON.parse...
Post a Comment
Read more

Convert Json to String Arrays

Convert Json to String Arrays This is my code for my form: product name: product detail: <button id="btn" type="submit" class="btn btn-default">Submit</button> This is my javascript $(function postProduct() { $('#btn').click(function () { var productName = document.getElementById("name").value; var productDetail = document.getElementById("detail").value; var dimensions = [ productName, productDetail]; var keys = $.map(dimensions, function (value, key) { return key; }); if (productName == '' || productDetail == '') { alert("Please Fill All Fields"); } else { $.ajax({ type: 'post', url: "api/product/addproduct", data: keys, dataType: 'j...
Post a Comment
Read more

how to submit image as part of form after converting from canvas

how to submit image as part of form after converting from canvas Suppose I convert a canvas to image using .todataURL and then I want to submit this image as a part of my form. .todataURL How can I do that? var url = document.querySelector('canvas').toDataURL(); How can use URL to submit this image as a part of my form? 1 Answer 1 You can add a hidden field in the form using JavaScript then submit var canvas = document.getElementById('canvas'); var dataURL = canvas.toDataURL(); var input = document.createElement("input"); input.setAttribute("type", "hidden"); input.setAttribute("name", "name_you_want"); input.setAttribute("value", dataURL); //append to form element that you want . document.getElementById("Form").appendChild(input); console.log(dataURL); <canvas id="canvas" width="5" height=...
Post a Comment
Read more

star ratings not working with turbolinks django

star ratings not working with turbolinks django I just finished implementing star ratings into my django app and turbolinks is preventing the ability to rate posts. It just clicks out to a dead link - example: ratings/17/24/?return=/post/post.id/ When I refresh the post page it works just fine. I followed instructions from jquery turbolinks repo but still having the same issues. Any tips would be appreciated. By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.
Post a Comment
Read more

$(…).DataTable is not a function when using Laravel Mix

$(…).DataTable is not a function when using Laravel Mix I struggle using Laravel Mix and DataTables. The issue I have is that when I compile down my .js-files etc., each time I would then visit a page that would execute a jQuery datatable, the follwoing error is thrown: The error is: jQuery.Deferred exception: $(...).DataTable is not a function TypeError: $(...).DataTable is not a function Uncaught TypeError: $(...).DataTable is not a function From what I understand, $(...).DataTable is not a global variable, but how can I make sure that it is accessible "on a global scope" / within my app? $(...).DataTable The following is my setup: app.js import jquery from 'jquery/dist/jquery.slim' import 'bootstrap-sass' import 'datatables.net'; import dt from 'datatables.net-bs'; window.$ = window.jQuery = jquery; webpack.mix.js mix .js('resources/assets/admin/js/app.js', 'js/') .extract([ 'jquery', 'bootstrap-s...
Post a Comment
Read more

Check if certain stings (even with spaces) are in array

Check if certain stings (even with spaces) are in array Trying to compare two arrays and see if existing words (even with spaces) exists in both. See below. I think I have a rough idea. Thanks ahead for your help! HTML <meta name="keywords" content="dog, cat, humming bird, shark, king cobra"> Jquery var myArray = $("meta[name='keywords']").attr("content"); var myAnimals = ["humming bird","king cobra"]; if (jQuery.inArray(myAnimals, myArray) != -1) { alert('animal exists'); } Possible duplicate of Check if an array contains any element of another array in JavaScript – Mike McCaughan Jun 29 at 17:50 4 Answers 4 attr("content") will return a string. You can use ...
Post a Comment
Read more

Chrome extension to copy data from a specific location from each tab

Chrome extension to copy data from a specific location from each tab I have a task where in we have specific data of an element open in a webpage and there are multiple elements data opened in multiple pages. The data I need is located at a same location in each webpage. I need to copy the entire row of that data and as sson as I flip the tab by Ctrl + tab the next data of next element should be copied too and in the end I need to export them in an excel file. I would appreciate if someone can tell me how do I go about it. I want this to be done as a browser extension. Don’t forget to mark a good answer as “Solution” (✓). It gives the author +15 points and (something no one will tell you) it protects your question from being deleted. – 7vujy0f0hy 2 days ago 1 Answer ...
Post a Comment
Read more

Open multiple modals

Open multiple modals I have two modals and a button inside the first modal to open the second modal. What I need is to open the second modal without closing the first. modalOne = UIkit.modal("#modal_1"); modalTwo = UIkit.modal("#modal_2"); modalOne.on({ 'show.uk.modal': function(){ alert("Modal one is visible."); }, 'hide.uk.modal': function(){ } }); modalTwo.on({ 'show.uk.modal': function(){ alert("Modal Two is visible."); }, 'hide.uk.modal': function(){ } }); Maybe you'll have some answers on this link : stackoverflow.com/questions/31159929/… – Pierre Jun 29 at 16:00 Thanks. This is what I'm looking for. – user3383728 Jun 29 at 21...
Post a Comment
Read more

Time function that checks for certain days

Time function that checks for certain days I have the following time function that I use to output if the business is open or closed. The way I have it coded works fine for normal business weeks. What I am wanting to do is program it for holidays, such as Christmas, 4th of July, etc that are always on the same day, so the output shows we are closed. How would I program in the fixed holidays? function timeNow() { //Get time var d = new Date(), h = ('0' + d.getHours()).slice(-2), m = ('0' + d.getMinutes()).slice(-2); //Get Day new Date().getDay(); var day = new Date().getDay(); console.log(day); var operateDay = ''; if (day >= 1 && day <= 5) { operateDay = true; } else if (day < 1 || day > 5) { operateDay = false; } // Checking time range var operatingTime = ((h >= 8 && h < 17) || (h === 8 && m == 0)); var closedTime = (h >= 17 || h <= 8); ...
Post a Comment
Read more

json being returned via url but not via jquery

json being returned via url but not via jquery I'm using Visual Studio to develop an MVC app and I have a jquery function that seems to be causing problems. I developed an action method that returns a json object (jquery calls action > action calls a service > the service returns an object > action converts object to a model via a map then passes the model to json). The action can be called via url (passing an id parameter via the query string) and it returns the json to the web page, however, when I call the jquery function via the web page (click on a button that executes the jquery), I get a "localhost:50216 says an error has occurred" before the rest of the jquery function executes. Been researching this for several days and tried using Chrome's debugger to no avail. Hopefully this makes sense, but if I need to provide further information please let me know. Any insight would be much appreciated. Best, Jon $("#delayEditModal") .on("show...
Post a Comment
Read more

Use both Vue.js and jQuery autocomplete

Use both Vue.js and jQuery autocomplete I want to use both Vue.js and jQuery to make an autocomplete field displayed dynamically. new Vue({ el: "#el", data: { toggle: false } }); var tags = [ "ActionScript","AppleScript","Asp","BASIC","C","C++","Clojure","COBOL","ColdFusion", "Erlang","Fortran","Groovy","Haskell","Java","JavaScript","Lisp","Perl","PHP","Python", "Ruby","Scala","Scheme" ]; $("#autocompleteSearch").autocomplete({ source: tags }); https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js https://code.jquery.com/ui/1.12.1/jquery-ui.js https://unpkg.com/vue Toggle As you can see, it cannot work because of the v-if on the input. If I remove the v-if it works, but it is not displayed dynamically. How should I ...
Post a Comment
Read more

How to define the width and the height of table in html?

Image
How to define the width and the height of table in html? How to define the width and the height of table in html? and how to change the color and font size of that link(covered font with green), I would like to let pages beautiful, project_list.html as below, thank you so much for you help: {% extends 'base.html' %} {% block content %} <nav aria-label="breadcrumb"> </nav> <h3 class="mb-3">我学习的课程列表</h3> 课程序号 课程名称 部门名称 课程日期 课程时间 {% for course in courses %} {{ course.pk }} {{ course.name }} {{ course.department.get_html_badge }} {{ course.date }} {{ course.time }} {% empty %} 目前没有你所选技能的课程。 {% endfor %} <div class="card-footer"> .table .mb-0 { he...
Post a Comment
Read more

Hide DOM object in jquery but determined by other object

Hide DOM object in jquery but determined by other object how best to use jQuery to cause this link with class: "morelink_L3" to be hidden if the div that contains this text: "We understand things..." is less than 550 characters ? The fact that this div has no class or id makes it tricky for me - there is option of using "find() but that didnt work when i used it. this is what i tried: if($(".story_L3 > div").text().trim().length < 550) { $('.morelink_L3').hide(); } this is the html with problem: Section Description We understand things change in life and at work and we want to make sure you’re ready for anything. We have a host of information available to help you understand what you need to do and how we can support you through any change. </div> <span class="morelink_L3">Read More</span> </div> </div> 2 Answers ...
Post a Comment
Read more

Can I disable/enable Scrolling in Google Chart with a Button?

Can I disable/enable Scrolling in Google Chart with a Button? I have a Google line chart on my site, which show the school grades of a student over the course of his school years. I have mouse wheel zooming enabled. explorer: { axis: 'horizontal', maxZoomIn: 0.25, maxZoomOut: 4 }, Now I would like to give the user the possibility to disable scrolling with a button. Is it possible to remove the 'explorer' part or just disable scrolling through a variable? 1 Answer 1 sure, let's start by moving the explorer option to a separate variable... var options = { pointSize: 4 }; var explorer = { axis: 'horizontal', maxZoomIn: 0.25, maxZoomOut: 4 }; then we can enable explorer like so... options.explorer = explorer; to disable... options.explorer = null; keep in mind, anytime an option is changed, the chart needs to be re-drawn... see foll...
Post a Comment
Read more