Results 1 to 9 of 9

Thread: [DHTML] Extremely Easy In-place-editing

  1. #1
    Join Date
    Dec 2007
    Location
    Ankara, Turkey
    Posts
    160
    Thanks
    2
    Thanked 2 Times in 2 Posts

    Default

    Hello again everyone

    Quote Originally Posted by BYK View Post
    And I cannot think of another easy and unobtrusive way of implementing it but any idea is welcomed.
    I have found a much more easier and an unobtrusive way!

    I'll cut this short,

    The demo is located at http://amplio-vita.net/JSLib/demos/q...it_3/final.htm
    a quick tutorial can be found at http://code.google.com/p/av-jslib/wi...ckEditTutorial

    You can change anything in the demo as you can see. But they are not recorded and for the image change, whatever you send, it shows another image always which is again for security concerns of the public demo.

    If you take a look at the source code, you can see the '<style type="text/quickEdit">' section which is used to define editable elements and their editability properties. As you can see it is a harmony of CSS selector syntax and the Javascript's JSON format.

    Please have a look at the demo, if you have time download it with the JS files
    and play around with it and PLEASE do comment on it

    Thanks for your attention.

    BTW, you can download all the files zipped from
    http://amplio-vita.net/zip/JSLib/js for JS files and
    http://amplio-vita.net/zip/JSLib/demos/quickEdit_3 for the demo.

    Note: The '<style type="text/quickEdit">' system is not the only way. You may use an external file (http://amplio-vita.net/JSLib/demos/quickEdit_2) or you can use an inline syntax (http://amplio-vita.net/JSLib/demos/quickEdit).

  2. #2
    Join Date
    Dec 2007
    Location
    Ankara, Turkey
    Posts
    160
    Thanks
    2
    Thanked 2 Times in 2 Posts

    Default

    By the way, any questions about the usage, or integration with site is welcomed as the comments

  3. #3
    Join Date
    Jan 2008
    Posts
    4,168
    Thanks
    28
    Thanked 628 Times in 624 Posts
    Blog Entries
    1

    Default

    Very neat script. Maybe you should set a cookie containing this data so next time I go there it has the same options.
    Last edited by Nile; 04-24-2008 at 02:57 AM.
    Jeremy | jfein.net

  4. #4
    Join Date
    Dec 2007
    Location
    Ankara, Turkey
    Posts
    160
    Thanks
    2
    Thanked 2 Times in 2 Posts

    Default

    It sends your data to the "change.php" but as I said, for the demo's security, I did not really set anything from the PHP file. But of course in a real application, they change and stay as you set

  5. #5
    Join Date
    Jun 2007
    Posts
    543
    Thanks
    3
    Thanked 78 Times in 78 Posts
    Blog Entries
    1

    Default

    if you accidentally delete all of the text and loose focus, there is no way for the average user to edit it anymore.
    [example]Erase the name and loose focus.[/example]
    [Jasme Library (Javascript Motion Effects)] My Site
    /\/\@ /\/\@|{
    There are 10 kinds of people in the world, those that understand binary and those that don't.

  6. The Following User Says Thank You to Master_script_maker For This Useful Post:

    BYK (04-25-2008)

  7. #6
    Join Date
    Dec 2007
    Location
    Ankara, Turkey
    Posts
    160
    Thanks
    2
    Thanked 2 Times in 2 Posts

    Default

    Ow. Thank you very much for this. Never thought of it, will prevent sending empty text.

    Thank you very much again.

    Err, it is a problem with the span's I think. I mean, when you empty the "Additional Info" part, since it is a div which has a width&height although it is empty, you can edit it.

    I'm looking for a CSS solution
    Last edited by BYK; 04-25-2008 at 05:08 AM.

  8. #7
    Join Date
    Jan 2008
    Posts
    4,168
    Thanks
    28
    Thanked 628 Times in 624 Posts
    Blog Entries
    1

    Default

    Also, if its empty it should restore to the text before it.
    Jeremy | jfein.net

  9. The Following User Says Thank You to Nile For This Useful Post:

    BYK (04-25-2008)

  10. #8
    Join Date
    Dec 2007
    Location
    Ankara, Turkey
    Posts
    160
    Thanks
    2
    Thanked 2 Times in 2 Posts

    Default

    Alright, I checked again and again and realized that this is the inline elements' normal behavior.

    Also after Nile's post I realized that posting empty variables is meaningless so I fixed it as Nile said.

    Another thank you goes to Nile.
    Last edited by BYK; 04-25-2008 at 05:35 AM.

  11. #9
    Join Date
    Jan 2008
    Posts
    4,168
    Thanks
    28
    Thanked 628 Times in 624 Posts
    Blog Entries
    1

    Default

    Like I said, I think that it should return to the previous text.
    Jeremy | jfein.net

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •