How would I incorporate a prompt into a jeditable definition?

[kkaiser1952]

Description

I have this div;

<div id="genComments" class="editGComms"></div>

When changed its supposed to get edited by this function.

function CellEditFunction( jQuery ) {
    var call = 'call';
     $(".editGComms").editable("SaveGenComm.php", { 
             indicator  : "Saving...",
             placeholder: "",
             tooltip    : "Click to add...",
             style      : "inherit",
             id         : netid, 
             name       : call                                    //prompt('Put Your call')
}); 

… and many, many more Jedittable definitions
};

When the user clicks in the div there may or may not already be text. If there is text its emptied if not he can type into the div.

When he presses enter at the end of his edit, javascript kicks off jeditable in some magic way because of the on click event from jQuery for the div.

$('.editGComms').on("click", function(){
    $('.editGComms').empty();
});

Before the text is sent to the php program I need to append some information to the string being sent. In this case a name value. As you can see I tried putting a prompt for that information into the editable call. The problem is when you first load the page it runs that prompt. I can’t figure out a way for it to run the prompt only when .editGComms is passing the data to jeditable.

Putting it in the on click function doesn’t work, because the div is no longer available to edit. So my thought was if it could be done in jeditable call I could do what I need, but 3 hours of trying things has failed. Do you have a solution that might work? jQuery version: 3.3.1 Browser: Any OS: Any

[NicolasCARPi]

Hello Keith,

Did you try with "submitdata"?

Look at the first example of the Select on https://jeditable.elabftw.net/

This allows you to append data to what is sent.

So you can have:

var submitdata = {};

now as an option:

onsubmit: function() { submitdata['from_prompt'] = prompt('Ask the
user') },
submitdata: submitdata,

This will send the content of the prompt along.

[kkaiser1952]

I modified the CellEditFunctions() as follows:

$(".editGComms").editable("SaveGenComm.php", {      // genComm     
             indicator  : "Saving...",
             placeholder: "",
             tooltip    : "Click to add...",
             style      : "inherit",
             onsubmit   : function() { submitdata['from_prompt'] = prompt('Enter Your Call') },
             submitdata : submitdata,
             id         : netid
}); // End of GComms

But instead of the

field being editable nothing happens when you click in it. I don't get the prompt either. Just nothing. Obviously I didn't understand something.

[NicolasCARPi]

don't forget to declare var submitdata = {}; somwhere earlier in the code.

[NicolasCARPi]

and when pasting js code, wrap it with ~~~javascript and ~~~ ;)

[kkaiser1952]

You were right I forgot the var submitdata = {}, I’ve added that and it sequence works now but the only thing I get from the prompt is the "&from_prompt". How do I translate into what I entered when prompted?

[NicolasCARPi]

For me I get a key "from_prompt" with a value corresponding to what has been entered. Can you screenshot the Console (F12) -> Network -> Request pane?

[kkaiser1952]

I use Chrome or Safari so F12 doesn't take me there. I can get to Console but don't see Network -> Request pane.... I'm pretty lame at this Nicolas and I apologize.

Here is an example of the rawdata being sent to the php. As seen by echo '$rawdata';

2428=genComments&value=still+trying+to+resolve+the+final+issues&from_prompt=wa0tjtstill trying to resolve the final issues&from_prompt

The wa0tjt in there is the prompted data, notice it runs up against the actual data entered in the div (still trying to resolve the final issues). which means I have no way (that I know) of pulling that value out of the entry itself.

[kkaiser1952]

You can access the app like this.

Https://net-control.us/indexTest.php

From the dropdown select net #2428 (its in green, down a few places).

The space between the dropdown box and the purple button banner is the space defined as the

we are working with

Enter anything in it, it does immediately ask for a callsign, enter your name or anything really.

On Jun 23, 2020, at 5:14 PM, Nicolas CARPi notifications@github.com wrote:

For me I get a key "from_prompt" with a value corresponding to what has been entered. Can you screenshot the Console (F12) -> Network -> Request pane?

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/NicolasCARPi/jquery_jeditable/issues/220#issuecomment-648456360, or unsubscribe https://github.com/notifications/unsubscribe-auth/AA2FIHD7AEAKNUGQCOWU74DRYESN5ANCNFSM4OF7Y56Q.

[NicolasCARPi]

Yeah, so it's working as expected:

I entered blah in the div and blih in the prompt.

When using Chrome, F12 does bring up the developer tools with a network pane, it is paramount that you learn how to use it!!!!

[kkaiser1952]

You are absolutely right I need to work harder to become better at using Chrome’s developer tools, I’ve been trying I promise. I work on a Mac so some of the commands are slightly different. Pressing the “fn” key and F12 at the same time does indeed open the tools in Console mode. But I don’t see the other tools you said to use. I keep saying the day will come when people will ask me how to do this kind of thing. But at 67 those days are getting further apart…. Ask me about SAS…. 33 years in that. LOL

I see what you added. I should have told you how to verify what you entered by using the ’Time Line’ button on that same purple bar. And it shows in the report that you entered “blah” in the div. However the “blih” you entered in the prompt didn’t show up as you can see in this screenshot.

The entry on that first line should say “blih blah” would even be better if it said “blih: blah” (notice the colon). This is the part I’m not understanding how to fix.

On Jun 24, 2020, at 3:56 AM, Nicolas CARPi notifications@github.com wrote:

Yeah, so it's working as expected:

https://user-images.githubusercontent.com/3043706/85525244-2f22eb80-b609-11ea-9672-00c74e8688ec.png I entered blah in the div and blih in the prompt.

When using Chrome, F12 does bring up the developer tools with a network pane, it is paramount that you learn how to use it!!!!

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/NicolasCARPi/jquery_jeditable/issues/220#issuecomment-648691352, or unsubscribe https://github.com/notifications/unsubscribe-auth/AA2FIHCBNIGEL67U3H32RW3RYG5T5ANCNFSM4OF7Y56Q.

[NicolasCARPi]

That part doesn't depend on jeditable, which sends what you are asking it to send to your server-side script in PHP, but more on how you get the data back and what you do with it. Have a look at "intercept" option (again, see examples on https://jeditable.elabftw.net/). Probably your server side script needs to also send back that data along the rest so it can be integrated in the page.

Ask me about SAS…. 33 years in that.

Pretty cool! :) I love planes too, but mostly in simulators ;)

[kkaiser1952]

I can’t thank you enough for your time Nicolas, I know how valuable it is even in a time of pandemic. I’ll continue to work on my developer tools skills and I’ll keep pushing your adopted jeditable as the best in class.

SAS is a programming language, I started as a mainframe SAS programer in about 1979 or 1980 for Republic Airlines and retired from Delta in 2005. Unfortunately I’ve never had the pleasure of riding on a SAS plane, but I have owned some SAS shoes. LOL

On Jun 24, 2020, at 10:34 AM, Nicolas CARPi notifications@github.com wrote:

That part doesn't depend on jeditable, which sends what you are asking it to send to your server-side script in PHP, but more on how you get the data back and what you do with it. Have a look at "intercept" option (again, see examples on https://jeditable.elabftw.net/ https://jeditable.elabftw.net/). Probably your server side script needs to also send back that data along the rest so it can be integrated in the page.

Ask me about SAS…. 33 years in that.

Pretty cool! :) I love planes too, but mostly in simulators ;)

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/NicolasCARPi/jquery_jeditable/issues/220#issuecomment-648895480, or unsubscribe https://github.com/notifications/unsubscribe-auth/AA2FIHDZQU7WHCROTNW4NMTRYIMHVANCNFSM4OF7Y56Q.