JavaScript

Get value from textbox created with createElement

10-Aug-12 6:31

Oh I get it now. I was thinking about the wrapping it again, but was more focused on the name.

Thanks, That was still big gun help there!

jkirkerx6-Aug-12 15:48

Re: Get value from textbox created with createElement

6-Aug-12 15:48

Well I'm getting bolder here with Javascript.

This eludes me, I can create a element and set the value no problem, I can get the value via Jquery no problem if the element is pre-dom, but if I create an element with createElement, I was thinking since my element is new in the DOM, it would be easy to retrieve the value via function. I'm missing something really basic here in principal, and this is the first time I have created a textbox this way.

It's written to be compatible with IE and Firefox browsers at the same time, in a single version.

I keep getting 'undefined' as the value of the code textbox. The function works, I just can't the appendCode from the textbox.

I've tried 3 versions so far. Just thought I'd ask, tomorrow I will have a fresh hat on to think with.

The Element

var txt_Element_L1_Code_Field = document.createElement("input");
    txt_Element_L1_Code_Field.id = "_txt_Element_L1_Code_Field_" + dynamicCart_Element1.idx;
    txt_Element_L1_Code_Field.type = "text";
    txt_Element_L1_Code_Field.style.paddingLeft = "5px";
    txt_Element_L1_Code_Field.style.width = "90%";
    txt_Element_L1_Code_Field.style.backgroundColor = "rgb(255,255,255)";   
    td_Element_L1_Code_Field.appendChild(txt_Element_L1_Code_Field);

Version 1 function that is binded

txt_Element_L1_Code_Field.onkeydown = function () {
        var appendCode;
        if (txt_Element_L1_Code_Field.innerText != "") {
            appendCode = txt_Element_L1_Code_Field.value;
        }

        span_Element_L1_CPN_Field.innerText = appendCode;
        span_Element_L1_CPN_Field.innerHTML = appendCode;
    };

Version 2: function that is binded

txt_Element_L1_Code_Field.onkeydown = function () {
        var appendCode;
        if (txt_Element_L1_Code_Field.innerText != "") {
            appendCode = txt_Element_L1_Code_Field.innerText;
        }
        else if (txt_Element_L1_Code_Field.innerHTML != "") {
            appendCode = txt_Element_L1_Code_Field.innerHTML;
        }

        span_Element_L1_CPN_Field.innerText = appendCode;
        span_Element_L1_CPN_Field.innerHTML = appendCode;    
    };

Version 3:
I lost it, gone

BobJanova7-Aug-12 0:12

Re: Get value from textbox created with createElement

7-Aug-12 0:12

Just use textBox.value. innerText and innerHTML will typically be empty for an <input>, for obvious reasons if you think about the markup.

jkirkerx7-Aug-12 6:24

Re: Get value from textbox created with createElement

7-Aug-12 6:24

It took a while to test, but ended up very simplistic using .value

Thanks for the extra eyes, been awhile since I've used pure Javascript to get values.

twseitex7-Aug-12 8:25

twseitex

7-Aug-12 8:25

Maybe this

IE 8 needs
var pointer=createElement(');
var pointer1=pointerOfObject.appendChild(pointer);
but not pointer1.type="here_the_kind_of_button";

Opera needs
var pointer=createElement('INPUT');
var pointer1=pointerOfObject.appendChild(pointer);
pointer1.type="here_the_kind_of_button";

innerText not possible for Mozilla.
Please use .innerHTML
.innerText contains only plain text.
.innerHTML contains e.g. HTML tags like

Re: Get value from textbox created with createElement

jkirkerx8-Aug-12 10:54

adapt datatable jquery to jee application

8-Aug-12 10:54

I ended up writing this, but I do need to go back and see if IE can just use innerHTML. I'm still messing around between IE, Firefox, and I need to do opera as well.

onkeyup element is created with createElement('input');

var txt_Element_L1_Code_Field = document.createElement("input");
    txt_Element_L1_Code_Field.id = "_txt_Element_L1_Code_Field_" + dynamicCart_Element1.idx;
    txt_Element_L1_Code_Field.type = "text";
    txt_Element_L1_Code_Field.style.paddingLeft = "5px";
    txt_Element_L1_Code_Field.style.width = "90%";
    txt_Element_L1_Code_Field.style.backgroundColor = "rgb(255,255,255)";
    txt_Element_L1_Code_Field.style.border = "solid 1px rgb(255,228,225)";
    txt_Element_L1_Code_Field.maxLength = 8;
    td_Element_L1_Code_Field.appendChild(txt_Element_L1_Code_Field);

txt_Element_L1_Code_Field.onkeyup = function () {        
        var appendCode = txt_Element_L1_Code_Field.value;
        span_Element_L1_CPN_Field.innerText = partNumber.toUpperCase() + "-" + appendCode.toUpperCase();
        span_Element_L1_CPN_Field.innerHTML = partNumber.toUpperCase() + "-" + appendCode.toUpperCase();
    };

ahmadiss4-Aug-12 23:34

ahmadiss

4-Aug-12 23:34

CSS

I want to adapt this datatable: http://www.datatables.net/release-datatables/examples/server_side/row_details.html for use in my application jee

I spent a lot of time researching how to use it but always without result I managed to adapt this one: http://www.datatables.net/release-datatables/examples/basic_init/table_sorting.html the table but I have not succeeded expandable can you point me to a tutorial or clear me how

thank you very much

Re: adapt datatable jquery to jee application

Richard MacCutchan5-Aug-12 1:24

Richard MacCutchan

5-Aug-12 1:24

There are lots of Database articles here[^] on CodeProject.

One of these days I'm going to think of a really clever signature.

showmodaldialog return value undefined across domain

Amr M. K.4-Aug-12 23:24

Amr M. K.

4-Aug-12 23:24

Dear All,
I have problem , I am trying to use showmodaldialog javascript.
it always return undefined if you call page from out of domain,while if try to call page inside domain will return result

Yes. CreatiVity withOuT limiTs

Re: showmodaldialog return value undefined across domain

jkirkerx5-Aug-12 11:05

Re: showmodaldialog return value undefined across domain

5-Aug-12 11:05

Some Javascript and Jquery in same domain only, like $.AJAX

You would have to post code for a better anwser

Amr M. K.6-Aug-12 22:05

Amr M. K.

6-Aug-12 22:05

could u check next reply

Yes. CreatiVity withOuT limiTs

Re: showmodaldialog return value undefined across domain

BobJanova5-Aug-12 23:43

Re: showmodaldialog return value undefined across domain

5-Aug-12 23:43

You can't use AJAX across domains. If this script is using AJAX under the covers then it won't work with a cross-domain URL.

Amr M. K.6-Aug-12 21:26

Amr M. K.

6-Aug-12 21:26

No I am just call from site ZZZ
var dlgResult = showModalDialog("YYYYY.aspx", '', "dialogWidth:880px;dialogHeight:400px;status:1");

In site YYYYY
YYYYY.aspx
return

function ExitPage(UserName,CardSerial)
       {
       var dlgResult = new Array();

           dlgResult["UserName"] = UserName;
                  window.returnValue = dlgResult;

           window.close();
       }

but alway return undefined
I test same procedure in pages in save domain ZZZ
,and return correct result

Yes. CreatiVity withOuT limiTs

Evalulating and passing RGB values from keydown

jkirkerx2-Aug-12 8:12

Re: Evalulating and passing RGB values from keydown

2-Aug-12 8:12

I'm working on a color picker, to alter the canvas color of images uploaded.

So I have a manual RGB input, 3 textboxes

I wrote a program to evaulate the keydown, and can capture BS, DEL 0-9, but I also need to check that the whole number is 0-255.

I'd like to do it in one shot, but I'm not sure if it's possible, and where to implement it.

Just looking for suggestions.

$('[id*="_txt_Red"]').keydown(function (e) {
  return evaulateKeyDown_RGB(e);
});

function evaulateKeyDown_RGB(e) {

    // Delete = 46 | BS = 8 | 0 = 48 | 9 = 57 | < = 37 | > = 39
    // Delete = 46 | BS = 8 | 0 = 96 | 9 = 105 | < = 37 | > = 39 
    var charCode = e.keyCode || e.which;
    //alert(charCode);
    
    // Normal Keyboard
    if (charCode == 8 || charCode == 37 || charCode == 39 || charCode == 46 || ( charCode >= 48 && charCode <= 57 )) {
        return true;
    }
    // Numeric Keypad    
    else if (charCode >= 96 && charCode <= 105) {
        return true;
    }
    else {
        return false;
    }
}

enhzflep2-Aug-12 9:58

enhzflep

2-Aug-12 9:58

Rather than evaluate the keystrokes themselves, I'd probably be tempted to try to just evaluate the text in an input control. You could create a validation function that was called in response to key-up/mouse-up/onchange events (not sure if mouse-up will catch pasting with the mouse)

Let's say you've got a string that represents the number 255.

JavaScript

var myStr = '255';
var myInt = parseInt(myStr);

if ((myInt != NaN) && (myInt < 256))
{
  doSomething();
}

else
  alert("Error\nYou must enter a number between 0 and 255");

If I've misunderstood your needs, sorry!
(still jealous you were at Xerox at such a pivotal time in PC history)

Re: Evalulating and passing RGB values from keydown

jkirkerx2-Aug-12 11:54

Re: Evalulating and passing RGB values from keydown

2-Aug-12 11:54

You right on, and I have stuff for onChange binded to a function.

So I'm using 2 events then, to separate them.

(I was too young to translate it into wealth, and on the wrong end of CA.)

BobJanova5-Aug-12 23:31

Re: Evalulating and passing RGB values from keydown

5-Aug-12 23:31

If you're going to do live validation, make sure it's not annoying ... i.e. make sure you can delete everything and start typing, that you can paste into it, and that normal patterns of modification still work. For example to change 192 to 196, people might go to the end and press 'backspace, 6' (which would be fine), or they might go in front of the 2 and type '6, delete' which would produce an intermediate of 1962.

Generally you should only adjust the display to indicate a valid or invalid value, instead of actually rejecting keystrokes, if that character can ever be part of a valid input.

jkirkerx6-Aug-12 7:22

Re: Evalulating and passing RGB values from keydown

6-Aug-12 7:22

I found that out on testing, what a mess. So far so good, but I need to go back and fix control v and control c, for pasting in values.

So I did filter the keystokes, and then ran the validation on the update image button, when you work with rgb, I update the hex, update the hex, I update the rgb, and the sample color swatch.

Ended up with this so far, without the copy and paste functionality. I need to go back and add that. Still testing the full functionality, and taking note of any errors.

My validate_HEX is not working right, I need to check the regex, or my use of .test is not correct.

Tell me what you think. I'm getting better at writing javascript.

Oh, Thanks for your comment, I pretty much got crickets on this one.

function evaulateKeyDown_RGB(e, targetObj) {

    // Delete = 46 | BS = 8 | 0 = 48 | 9 = 57 | < = 37 | > = 39
    // Delete = 46 | BS = 8 | 0 = 96 | 9 = 105 | < = 37 | > = 39
    var charArray = [8, 9, 17, 18, 37, 39, 46, 48, 49, 50, 51, 52, 53, 54,
    55, 56, 57, 96, 97, 98, 99, 100, 101, 102, 103, 104, 105];
    
    var charCode = parseInt(e.keyCode || e.which);        
    for (var i = 0; i < charArray.length; i++) {
        if ((charCode != NaN) && (charArray[i] == charCode)) {
           return true
        }
    }
    return false;   
}

function evaulateKeyDown_HEX(e, targetObj) {
    
    // Delete = 46 | BS = 8 | 0 = 48 | 9 = 57 | < = 37 | > = 39
    // Delete = 46 | BS = 8 | 0 = 96 | 9 = 105 | < = 37 | > = 39
    var charArray = [8, 9, 17, 18, 37, 39, 46, 65, 66,
    67, 68, 69, 70, 97, 98, 99, 100, 101, 102,
    48, 49, 50, 51, 52, 53, 54, 55, 56, 57,
    96, 97, 98, 99, 100, 101, 102, 103, 104, 105];
   
    var charCode = parseInt(e.keyCode || e.which);
    for (var i = 0; i < charArray.length; i++) {
        if ((charCode != NaN) && (charArray[i] == charCode)) {
            return true
        }
    }
    return false;    
}

function validate_RGB(targetObj) {

    // Check if the whole value is 0-255
    var charFlag = false;
    var value = parseInt(targetObj.val());
    if ((value != NaN) && (value <= 255)) {
        targetObj.css("border", "solid 1px rgb(140,140,140)"); 
        return true;
    }
    else {
        targetObj.focus().select();
        targetObj.css("border", "solid 1px rgb(255,0,0)");
        return false;      
    }
}

function validate_HEX(targetObj) {

    var hValue = targetObj.val();
    var regColorcode = /^(#)?([0-9a-fA-F]{3})([0-9a-fA-F]{3})?$/;
    if (regColorcode.test("#"+hValue) == false) {
        targetObj.focus().select();
        targetObj.css("border", "solid 1px rgb(255,0,0)");
        return false;
    }
    else {
        targetObj.css("border", "solid 1px rgb(140,140,140)"); 
        return true;
    }
}

BobJanova7-Aug-12 0:11

7-Aug-12 0:11

The regex looks okay. What's .val()? Text boxes have a .value in normal DOM object speak.

Installing Pygame

johtnkucz30-Jul-12 4:36

johtnkucz

30-Jul-12 4:36

Hey mates, have been trying to install pygame and can't get it to install. It and it's corresponding 3.2 python installs appropriately but 'import pygame' doesn't recognize the module. Have tinkered with 32 and 64-bit versions.

>>>>
Traceback (most recent call last):
File "<pyshell#0>", line 1, in <module>
import pygame
ImportError: No module named pygame
>>>>>>

Is the error message. Have tried to install this on linux and windows 7...getting very vexed at seeing that error message. I NEED to install pygame. Any assistance with this would help. Thanks.

modified 30-Jul-12 10:45am.

johtnkucz30-Jul-12 4:45

johtnkucz

30-Jul-12 4:45

actually I might be able to accomplishe some gui things with tkinter but want to install pygame.

Richard MacCutchan30-Jul-12 6:14

Richard MacCutchan

30-Jul-12 6:14

Is this anything to do with Javascript?

One of these days I'm going to think of a really clever signature.

Sandeep Mewara31-Jul-12 8:56

Sandeep Mewara

31-Jul-12 8:56

Richard MacCutchan wrote:
Is this anything to do with Javascript?

Yep! Looks like Pygame is made on top of GameJs (a JavaScript game engine)
Some detail here: http://gamejs.org/[^]

Though, what OP has asked does not connect to a JavaScript question from any angle. D'Oh! | :doh:

Sandeep Mewara
[My last article]: Server side Delimiters in ASP.NET[^]