I'm using the following JS code to open a wp.media window to allow users to select images and videos for a gallery. Everything is working as expected, but I'm unable to restrict the window to show images and videos only, it's showing everything. Any ideas on what might be wrong? Thanks in advance JS: $( '#add_item' ).on( 'click', function( e ) { var $el = $( this ); e.preventDefault(); // If the media frame already exists, reopen it. if ( …

I am using the latest version of the REST API plugin in a project and I've added my routes to a separate namespace (as recommended in the documentation). The javascript client included with the API automatically creates models and collections based on the public routes in the wp/v2 namespace. Does anyone know if it's possible to extend the built-in client to use a custom namespace, and automatically parse the root endpoint to generate the models and collections for my private …

Using the WP API and Backbone-based JS client, I'm trying to update a post's metadata as follows: var parentId = 96; // the post id var metaData = new wp.api.collections.PostMeta('', {parent: parentId}); metaData.fetch() .done(function(data) { var someKey = data.findWhere({key: 'someKey'}); someKey.set('value', 'newValue'); someKey.save(); }); Everything works fine until the calling of save(), which throws the following error: PUT http://example.org/wp-json/wp/v2/posts/undefined/meta/1901 404 (Not Found) Trying to sync the collection also fails. Any thoughts? Thanks!

I've enqueued a .js file on the "Media Library" page (upload.php). I need to hide and manipulate a few of the thumbnails on the page using JS only ( I'm not looking for workarounds ). The elements on the page are being rendered by backbone and I have found no way so far to hook into it. In any window/document state, $('li.attachment').hide() function for example won't do it's job because of this. I have tried going with the following piece …

I'm trying to use the Backbone, customizing the Author Filter in media library grid view. I found lots of information on the Internet, and create filter on the toolbar. But there is one error I can't figure it out. The filter can't index + 1 for my items, I know there is a hidden item I need to add, but anything I tried can't achieve that. Here is the code I tried. (function(){ // create Author Filter var MediaLibraryCustomFilter = …

Using the rest API I retrieve a collection of posts: const recordsParams = {} const recordsCollection = new wp.api.collections.MyPostType(); recordsCollection.fetch( { data: recordsParams } ) .then( records => { this.records = records } ).catch( error => { console.log( error ); } ) I then loop on each retrieved post and I need an equivalent to the PHP's <?php current_user_can('edit_myposttype', $post_id); ?> in order to check if the current user can edit each post and act accordingly. Is there something equivalent …

I’m making a webapp based on wordpress in which I’m using the REST API for my users to get and create posts. I found the very useful REST API backbone javascript client which seems great. However the documentation in this link is limited to only a few selected examples. Is there a more complete documentation? With more examples? I'm trying to filter posts by author and status. To display current user's drafts and published posts in different places. How do …

I'm trying to use the new wp.media uploader frame for an app I'm building. I've read up a lot on other questions, blog posts, etc etc. The code I pasted below is working already quite fine and even does some extra stuff that I left in for reference in case it's useful to anyone. But there is one modification I'd like to bring to it: when the frame is opened, I want it to filter the "media library" display to …

I'm getting started with a project that is making use of Backbone and the WP REST API, but I"m having a little trouble. Using the built in API JS for models and collections allows me to pretty easily update a post title or content. All I have to do is call: this.model.set({title: 'New Title'}); this.model.save(); And everything works really well. But for post meta, there doesn't appear to be an easy way to update an entry to the database. Does …

So I have this small piece of code that renders an array of IDs: const selected = this.$data.list.selected; function get_ids(input, field) { const output = []; for (let i=0; i < input.length ; ++i) output.push(input[i][field]); return output; } const result = get_ids(selected, "id"); Now inside my JS, I want to be able to use the backbone.js API that WordPress provides to save it to my employee custom post type as a post meta. So let's say that my result output …

I have a Custom Post Type called pronews. I registered it with show_in_rest enabled. I'm using WordPress 5.5. I then have this code: export const ProPost = wp.api.models.Post.extend( { urlRoot: wpApiSettings.root + 'wp/v2/pronews', defaults: { type: 'pronews', }, } ); export const ProPosts = wp.api.collections.Posts.extend( { url: wpApiSettings.root + 'wp/v2/pronews', model: ProPost, } ); const post = new ProPost( {id: 2454} ); console.log( post ); console.log( 'post urlRoot:' + post.urlRoot ); console.log( 'post url:' + post.url ); post.fetch().then( ( response …

I have created a plugin in with several custom REST endpoints. However I can not get the permission callbacks to work. Current user is always '0'. I'm using localize script to send the nonce. wp_localize_script( $this->cloud_base, 'POST_SUBMITTER', array( 'root' => esc_url_raw( rest_url() ), 'nonce' => wp_create_nonce( 'wp_rest' ), 'success' => __( 'Data Has been updated!', 'your-text-domain' ), 'failure' => __( 'Your submission could not be processed.', 'your-text-domain' ), 'current_user_id' => get_current_user_id() ) ); And then in the javascript code i'm …

TL;DR How do I get the HTML markup created in the Media Frame modal and insert it into the editor/page content? I'm trying to insert media from a custom router-tab in the media frame. But I have no idea how to take the HTML markup created in the media frame and place it into the page content. My code so far is based on the Github repo custom_media_menu.js created by Fab1en. https://gist.github.com/Fab1en/4586865 jQuery(document).ready(function(){ // custom state : this controller contains …

How could I add button next to "edit image" button in "Attachment Details" This is the location I would like to add button, Do you have any recommend?

I want to dequeue all styles and scripts that are loaded on the front-end (EG. not the admin panel) by default. I found this function, but am not sure how to utilize it to accomplish my goal. I'm seeing a ton of assets that I don't need on the front end, loaded by WP core: For example: backbone.js jquery UI jquery UI datepicker 5 different mediaelement assets (js + css) underscore.js wp-embed js wp-util js

I am trying to fetch posts of a custom post type (cpt) with the backbone js client. I registered the cpt with the show_in_rest param set to true. I enqueued the wp-api script. The url http://myweb.com/wp-json/wp/v2/custom works. In the js, this works: wp.api.loadPromise.done( function() { var _posts = new wp.api.collections.Posts(); }); but this does not: wp.api.loadPromise.done( function() { var _custom = new wp.api.collections.Custom(); } ); saying "wp.api.collections.Custom is not a constructor" Why? ps: I registered to cpt like this: register_post_type('custom', …

I'm attempting to write a plugin that will present a mostly pre-filled out form with a custom header. I've created a RESTful endpoint to supply and receive the data. And I've created a Model in Backbone.js: var app={}; app.pilot_id = $("#user_id").val(); app.Pilot = Backbone.Model.extend({ url: POST_SUBMITTER.root + 'pilotdata/v1/pilot/', sync : function(method, model, options){ return Backbone.sync(method, this, $.extend(options, {beforeSend : function (xhr) { xhr.setRequestHeader ('X-WP-NONCE', POST_SUBMITTER.nonce); } })) }, defaults : { lastName: 'Doe' , firstName: 'John' }, initialize : function(){ …

I have created a custom endpoint that returns select user meta data. I am trying to access this endpoint with Backbone. It works as expected in Postman and from my Backbone/javascript script If I have my access check dummied out. var app2 ={}; app2.Pilot = Backbone.Model.extend({ url: POST_SUBMITTER.root + 'pilotdata/v1/pilot/' }); app2.pilot = new app2.Pilot(); app2.pilot.fetch( {data: ({ id: 1 })} ).then(function(){ console.log(app2.pilot) }) Of course can't have the data hanging out naked. So I implement my access check and …

I'm writing a plugin to allow users to update information stored in wp_usermeta. I'm trying to use the Backbone JavaScript client with REST. I have the HTML code. <div id="container">Loading...</div> And my JavaScript code (function( $ ) { 'use strict'; $(function(){ var app ={}; app.pilot = new wp.api.models.User( { id: 1} ); app.pilot.fetch().then(function(){ console.log( app.pilot ); new app.PilotDataView({model: app.pilot}); }); app.PilotDataView = Backbone.View.extend({ el: '#container', template: _.template("<h3>Hello <%= name %> </h3>"), initialize: function(){ this.render(); }, render: function(){ this.$el.html(this.template(this.model.toJSON() )); return …

I'm trying to use the REST API with Backbone in a plugin. I'm working through the documentation and examples at: https://developer.wordpress.org/rest-api/using-the-rest-api/backbone-javascript-client/. The first example to create a post works as expected: // Create a new post var post = new wp.api.models.Post( { title: 'This is a test post' } ); post.save(); a new post is created. However the next example to fetch a post : var post = new wp.api.models.Post( {id:1} ); post.fetch( ); console.log(JSON.stringify(post)); Does nothing. I have tried …