How do I make a textBox that updates whenever the content changes?

2

How do you make a textBox that updates the database values that are placed in it?

That is, textBox is filled in and the user decides to change what is there and wanted to immediately * trigger a method to update the information that was placed in the textBox database.

I'm working on HTML and C # in codebehind .

* In Brazil, "shoot"

    
asked by anonymous 30.01.2014 / 11:31

6 answers

2

As I understand it, you work with Asp.Net Web Forms. The solution is simple: add the AutoPostBack property and listen for the TextChanged event.

ASPX:

<asp:TextBox runat="server" ID="MinhaTextBox" AutoPostBack="true" OnTextChanged="MinhaTextBox_TextChanged" />

CodeBehind:

public void MinhaTextBox_TextChanged(object sender, EventArgs e)
{
    // Atualizar conforme MinhaTextBox.Text
}
    
30.01.2014 / 15:54
0

You can create a javascript function that triggers a servlet or webservice every time a key is pressed in your textbox (or input of html). For example in jQuery :

$('#nome-elemento').keypress(function() {
    var texto = this.value;
    $.post("endereco/da/servlet-ou-webservice", {"texto": texto}, function(retorno){
      //callback
    });
});|

It would be interesting if you specified a minimum time between the writes or the servlet / webservice will be called to each character inserted in the textbox.

    
30.01.2014 / 11:44
0

You want to use the database as you type in a% of html , right?

If so, you will need to use AJAX .

There are some methods for capturing user typing in the DOM: textarea and onKeyUp are examples.

Theoretically, every keystroke you should send such information to the database - and here you should worry about performance - causing it to update something over there.

Imagine this as an ordinary AJAX, except that instead of you being sending the information through a typical post, you would be doing this through another type of trigger.

I gave you an example:

$('form textarea').on('keyup', function () { // quando você pressionar uma tecla no textarea...
    var $data = $(this).serialize(); // serializa a informação digita em uma variável

    $('.report').html($data); // exibe a informação serializada/digitada na div .report

    /**
     * depois, envia através de uma requisição post
     * as informações para '/path/to/action',
     * sendo tal endereço uma action do seu backend
     * escrito em C#.
     *
     * Lembrando que este backend tem a responsabilidade
     * de fazer a operação de banco de dados
     * que você deseja.
     *
     * Caso consigamos acessar a action, você cairá na função
     * 'success', onde imprimiremos no console
     * a resposta enviada pelo servidor.
     */
    $.ajax({
        type: 'POST',
        url: '/path/to/action',
        data: $data,
        success: function (response) {
            console.log(response);
        }
    });
});

If you want to play, it's available here in jsFiddle .

You will need jQuery to run the example.     

30.01.2014 / 11:45
0

You can use Ajax requisitions together with the change of the field, but it is better to trigger the request based on a click button save, imagine accessing the bank with every letter that the user types, that would be pretty bad on some occasions.

Ajax (jQuery): link
Change jQuery: link
Click (jQuery): link

    
30.01.2014 / 11:52
0

Take a look at the AngularJS .

It is a framework in Javascript that puts states of execution in the pages created by it.

In this way you can create a template (in js), update this template information and angularjs itself propagates the updates to its components on the page.

    
30.01.2014 / 15:47
0

Friend, you first need to use AngularJS . If you do not know this framework, I advise you to stop everything you are studying to take a look at it. It is extremely simple to understand and very powerful. It has the feature you're looking for, which is binding automatic. If you take a look at on this site here , you will find a very quick and simple tutorial , but that does what it needs.

Another thing I can tell you is to use a ajax action to save what was written to the database, using any server-side technology for this. The AngularJS itself has its simple and practical way of doing this:

$http.post('/someUrl', data).success(successCallback);)

Here's a clear example of what I'm talking about: JSFIDDLE

    
31.01.2014 / 13:26