0

I want to append various things to an input with buttons.

button#addNumber -> appends 245

button#addOperation -> appends +

A problem arises with button#radicSign.

I want to add the template for a square root sqrt() and place the caret inside the parentheses afterwards for the user to type in the number.

Is this possible?` If yes, is it worth the effort? Or should I open a dialog box and insert it then?

$('button#radicSign').on('click', function add2digit() {
    addOperation('sqrt');
  });

function addOperation(op) {
    var problemInput = $('input#testProblem');
    problemInput.val(problemInput.val() + op);
}
user3787706
  • 659
  • 1
  • 6
  • 18
  • Add the code snippet please, here or on https://jsfiddle.net. – sergdenisov Jan 30 '16 at 18:48
  • there is no code snippet. everything is really basic. i just want to know how i can place the caret between the parentheses after i have appended `sqrt()` but there you go, i added the code – user3787706 Jan 30 '16 at 18:50
  • 1
    http://stackoverflow.com/questions/499126/jquery-set-cursor-position-in-text-area – user1702401 Jan 30 '16 at 18:52
  • @user1702401 that's not it. i don't want a fixed offset, but the position RIGHT between the parentheses, wherever they are inserted (could be first thing in the string, could be 30 chars in) – user3787706 Jan 30 '16 at 18:53
  • 1
    @user1702401, while very useful, doesn't fully answer the OP's question. – michael Jan 30 '16 at 18:54

1 Answers1

1

You should be able to do something like this to achieve what you want:

$('#sqrt').click(function() {
  var length = $('#a').val().length;
  $('#a').val($('#a').val()+'sqrt()');
  $('#a').focus()[0].setSelectionRange(length+5, length+5);
});

JSFiddle

michael
  • 748
  • 4
  • 10
  • mhhhhh.. the idea looks right... but i think that's also not quite the solution. you have to know: there can (and probably will) be other stuff before the sqrt() in the string. so assume the string is `2453 + 423 - 244 +`, now i want to append a `sqrt(144)`. an empty `sqrt()` has to be appended to the string with the caret placed between the `()`. all is happening in the same input field – user3787706 Jan 30 '16 at 19:03
  • oh wow really didn't see the fiddle. that's exactly what i wanted, thanks :) – user3787706 Jan 30 '16 at 19:08
  • No worries, haha, I was really confused for a moment. – michael Jan 30 '16 at 19:08
  • oh well now i have yet another problem... your solution works fine. but now i want to be able to insert a number per button click between the parentheses (click sqrt, then click 3-digit number -> 3-digit number between the parentheses) but i have set it to `append()`. how can i write directly to the caret position? :) – user3787706 Jan 30 '16 at 20:13
  • You'll have to pull the current value, add in the number in the string where you want it using something like `.slice()`, then update the value of the text input. You could also convert the string to an array, and use `.splice()` to add in the number at the specified index. – michael Jan 30 '16 at 22:26