sukumaran / jquery-in-place-editor

Automatically exported from code.google.com/p/jquery-in-place-editor
Other
0 stars 0 forks source link

Feature Request: field_type: "date" (and custom plugins) #20

Open GoogleCodeExporter opened 8 years ago

GoogleCodeExporter commented 8 years ago
http://jqueryui.com/demos/datepicker/

Original issue reported on code.google.com by warp...@gmail.com on 12 Oct 2009 at 6:03

GoogleCodeExporter commented 8 years ago
I'm thinking about exposing a subclass interface to add different editor types, 
just out of curiousity, would you 
like to provide the datepicker class If I do so? And if so, what callbacks with 
what arguments would you need to 
implement this?

Original comment by mhaec...@gmail.com on 14 May 2010 at 9:14

GoogleCodeExporter commented 8 years ago
Yes, my project would also like to have datepicker as part of edit-in-place.

An implementation of this in a similar jquery edit-in-place plug-in can be 
found here:

http://www.appelsiini.net/2007/8/custom-input-types

Original comment by tomcooli...@gmail.com on 24 Jun 2010 at 11:53

GoogleCodeExporter commented 8 years ago
In my site, I use unobtrusive javascript to mark in input element for a 
datepicker.  I add an attribute called 'data-datepicker'.  I also use a 
function to find all elements with the attribute and to apply the jQueryUI 
datepicker.

In order to integrate this into in-place-editing, I place the data-datepicker 
attribute in the wrapper for the in-place-edit.  Then I modified the js source 
to copy any data attributes (if they exist) to the input tag created on the fly 
and to call the function that sets up datepicker after I add the input tag to 
the DOM.

I will post the code in the next comment.

Original comment by tuxcod...@gmail.com on 14 Jan 2011 at 7:18

GoogleCodeExporter commented 8 years ago
immediately after this line:
var original_html = jQuery(this).html();

Add the following:
var data_attributes_to_s = '';
jQuery.each(this.attributes,function(i,item){
  if (item.name && item.name.match(/data-/)) {
    data_attributes_to_s += ' '+item.name+'="'+item.value+'" ';
  }
}

--------------------------------------------------

replace this line:
jQuery(this).text().trim().escape_html() + '" ' + keydown + ' />';

with this line:
jQuery(this).text().trim().escape_html() + '" ' + keydown + 
data_attributes_to_s + ' />';

---------------------

After this line:
jQuery(this).html('<form class="inplace_form" style="display: inline; margin: 
0; padding: 0;">' + use_field_type + ' ' + buttons_code + '</form>');

Add something like this:
if (data_attributes_to_s.length > 0) {
  setup_datepicker();
}

Original comment by tuxcod...@gmail.com on 14 Jan 2011 at 7:21

GoogleCodeExporter commented 8 years ago
I think you should be able to do that without changing the code just through 
the callbacks didAddEditor gives you the dom object as 'this' so you can add 
all the markup you need.

At least until I have even better integration options.

Original comment by mhaec...@gmail.com on 28 Jan 2011 at 10:59