If you are using frames, you can get the height of the outermost window by using `window.top` in the jQuery constructor.  The height of [`window.top`][1] will get the height of the browser window.

    $(window.top).height();


Edit: Updated window.top reference as Mozilla moved their documentation around.
  [1]: https://developer.mozilla.org/en/DOM/window.top

I have always used this [implementation][1] 


  [1]: http://www.howtocreate.co.uk/tutorials/javascript/browserwindow


`window.innerHeight or document.body.clientHeight or document.documentElement.&#173;clientHeight` depending on the browser. 

But i don&#39;t see why jquery&#39;s $(window).height() wont work for your visible height ?

I had cause to address a similiar issue today, because in FF `screen.height` and `window.innerHeight` return the same value, and of course my first response was to check for solutions on SO.  In the end this is how I addressed the matter, and I&#39;m posting the longwinded version here for posterity only...

    function visibleWindowHeight( callback ) {
        /* create temporary element &#39;tmp&#39; */
        var vpHeight,
            tmp = document.createElement(&#39;div&#39;);

        tmp.id = &quot;vp_height_px&quot;;

        /* tmp height = viewport height (100vh) */
        tmp.setAttribute(&quot;style&quot;, &quot;position:absolute;&quot; +
            &quot;top:0;&quot; +
            &quot;left:-1px;&quot; +
            &quot;width:1px;&quot; +
            &quot;height:100vh;&quot;);

        /* add tmp to page */
        document.body.appendChild(tmp);
        
        /* get tmp height in px */
        vpHeight = document.getElementById(&quot;vp_height_px&quot;).clientHeight;
        
        /* clean up */
        document.body.removeChild(tmp);
        
        /* pass value to callback and continue */
        callback( vpHeight );
    }

    document.addEventListener(&#39;DOMContentLoaded&#39;, function() {

        visibleWindowHeight( function( visibleHeight ) {
        
            console.log(&quot;visibleHeight:&quot;, visibleHeight);
            /*
                ... continue etc etc  ...
            */
        });

    }, !1);
    
It might help someone, sometime.  &#128512; 

I want to detect whether the current Windows OS is 32-bit or 64-bit. How to achieve it using C++? I don&#39;t want processor type I want OS&#39;s bit type. This is because you can install 32-bit OS on 64-bit processor.



Detect 32-bit or 64-bit of Windows

I&#39;m trying to JSON encode some objects in PHP, but I&#39;m facing a problem: I want to encode data which is kept by a class private members.
I found this piece of code to encode this object by calling an encode function like:

    public function encodeJSON() 
    { 
        foreach ($this as $key =&gt; $value) 
        { 
            $json-&gt;$key = $value; 
        } 
        return json_encode($json); 
    }

However, this only works if the object I want to encode does not contain other objects inside, which is the case. How can I do to encode not only the &quot;outer&quot; object, but encode as well any members that are objects too?

PHP json_encode class private members

Is there any way to get the visible height of the whole page from inside an `iframe`, `$(window).height()` gives me the `iframe`s height?

Visible window height instead of $(window).height();

<p>Is there any way to get the visible height of the whole page from inside an <code>iframe</code>, <code>$(window).height()</code> gives me the <code>iframe</code>s height?</p>


Suppose I have an object `foo` in my JavaScript code.  `foo` is a complex object and it is generated somewhere else.  How can I change the prototype of the `foo` object?

My motivation is setting appropriate prototypes to objects serialized from .NET to JavaScript literals.

Suppose that I&#39;ve written the following JavaScript code within an ASP.NET page.

    var foo = &lt;%=MyData %&gt;;

Suppose that `MyData` is the result of invoking the .NET `JavaScriptSerializer` on a `Dictionary&lt;string,string&gt;` object.

At run-time, this becomes the following:

    var foo = [{&quot;A&quot;:&quot;1&quot;,&quot;B&quot;:&quot;2&quot;},{&quot;X&quot;:&quot;7&quot;,&quot;Y&quot;:&quot;8&quot;}];

As you can see, `foo` becomes an array of objects. I would like to be able to initialize `foo` with an appropriate prototype. I do *not* want to modify the `Object.prototype` nor `Array.prototype`.  How can I do this?

How to set the prototype of a JavaScript object that has already been instantiated?

How can I write a website using *HTML5*, *CSS* and *JavaScript* on client side that will allow **direct tcp/ip connection between the client browsers once the page is loaded**.

I need to do this to to reduce latency since the site will require that the input from one of the users to be transmitted to the other user as soon as possible so sending data from client A to Server and then to client B is not a good option.

I read previous posts on this subject but there were no working solution/examples available that I could find. From what i read the direct connection between clients can be made using plugins like Silverlight, Java or Flash.

Is there any solution that would not require plugins? I would like to use only JavaScript.

How can I make a browser to browser (peer to peer) connection?

Can a reserved word be used as an object&#39;s property name?

This issue was raised indirectly in a previous Stack Overflow question: https://stackoverflow.com/questions/5306315/browser-support-for-using-a-reserved-word-as-a-property-name-in-javascript. The answer seemed general consensus by [Alex Wayne](https://stackoverflow.com/users/62076/alex-wayne): 

&gt; You can use those words, but only as strings and not shorthand
&gt; properties.
&gt; 
&gt;     foo[&#39;class&#39;]; // cool
&gt;     foo.class;    // not cool

While I think that they are probably more knowledgeable than me in this area and it is probably a _bad idea_ to use reserved words in some situations, I think their conclusion is wrong based on two points:

* testing of the reserved words using them as a &quot;shorthand&quot; properties

* the HTMLFormElement makes it impossible _not_ to use reserved words in &quot;shorthand&quot;

First, using the reserved word list, each was added as a property to an `Object` and `HTMLElement`, both as `obj[&quot;word&quot;]` and `obj.word`, and then retrieved as `obj[&quot;word&quot;]` and `obj.word`.  In each of the 63 cases all eight tests worked correctly.

Second, the HTMLFormElement necessitates this works because it retrieves in its elements using shorthand notation.  If `&lt;input name=&#39;typeof&#39; value=&#39;scalar&#39; /&gt;` is an element of a form, then `form.typeof` == &quot;scalar&quot;.

From my experience, reserved words are usually data inflicted (e.g. a column named &quot;private&quot;), not program inflicted. As such they contaminate JSON objects, and from there input, and from there the HTMLFormElement. Simply put, without a huge amount of (IMHO unnecessary) work, it&#39;s impossible to keep reserved words _not_ being forced to work correctly in shorthand.

It seems to me these real problems:

* care needs to be taken not to conflict with existent **properties**, not reserved words

* (many if not all) **variables** cannot be reserved words

* use of reserved words as properties can be (but are not necessarily) confusing

Is this conclusion correct then, that reserved words as property names, and accessing them either as strings or shorthand, is just fine - as long as a little common sense is applied to the situation?

Using reserved words as property names, revisited

&gt; **Possible Duplicate:**  
&gt; [Retrieving file names out of a multi-file upload control with javascript](https://stackoverflow.com/questions/3654179/retrieving-file-names-out-of-a-multi-file-upload-control-with-javascript)  

&lt;!-- End of automatically inserted text --&gt;

From HTML5 input type=&quot;file&quot; allows users to choose multiple files by adding the multiple=&quot;multiple&quot; :

    &lt;input type=&quot;file&quot; multiple=&quot;multiple&quot; /&gt;

My question is: how can I get the value of that input? When using the .value it only returns the filename of the first file selected, but when choosing more than one I am not able to view the other ones.

What I have:

    &lt;input type=&quot;file&quot; multiple=&quot;multiple&quot; onchange=&quot;alert(this.value)&quot;
         onmouseout=&quot;alert(this.value) /&gt;

which as I told you, is only showing the name of one of the selected files.


NOTE: *I don&#39;t want to edit the value (I know that is not possible) only the name of the files*

Thanks!

Get input type=&quot;file&quot; value when it has multiple files selected

Using nginx, I want to preserve the url, but actually load the same page no matter what.  I will use the url with `History.getState()` to route the requests in my javascript app.  It seems like it should be a simple thing to do?

    location / {
        rewrite (.*) base.html break;
    }

works, but redirects the url?  I still need the url, I just want to always use the same page.

nginx: send all requests to a single html page

I&#39;m working on a mobile web site that has to work on a variety of devices. The ones giving me a headache at the moment are BlackBerry.

We need to support both keyboard clicks as well as touch events. 

Ideally I&#39;d just use:

    $thing.click(function(){...})

but the issue we&#39;re running into is that some of these blackberry devices have a very annoying delay from the time of the touch to it triggering a click. 

The remedy is to instead use touchstart:

    $thing.bind(&#39;touchstart&#39;, function(event){...})

But how do I go about binding both events, but only firing one? I still need the click event for keyboard devices, but of course, don&#39;t want the click event firing if I&#39;m using a touch device.

A bonus question: Is there anyway to do this and additionally accommodate browsers that don&#39;t even have a touchstart event? In researching this, it looks like BlackBerry OS5 doesn&#39;t support touchstart so will also need to rely on click events for that browser. 

ADDENDUM:

Perhaps a more comprehensive question is:

With jQuery, is it possible/recommended to handle both touch interactions and mouse interactions with the same bindings?

Ideally, the answer is yes. If not, I do have some options:

1) We use WURFL to get device info so could create our own matrix of devices. Depending on the device, we&#39;ll use touchstart OR click. 

2) Detect for touch support in the browser via JS (I need to do some more research on that, but it seems like that is doable).

However, that still leaves one issue: what about devices that support BOTH. Some of the phones we support (namely the Nokias and BlackBerries) have both touch screens *and* keyboards. So that kind of takes me full circle back to the original question...is there a way to allow for both at once somehow?

How to bind &#39;touchstart&#39; and &#39;click&#39; events but not respond to both?

I&#39;ve created a custom ValidationAttribute that compares 2 dates and makes sure that the second date is greater than the first:

    public sealed class IsDateAfter : ValidationAttribute, IClientValidatable
    {
        private readonly string testedPropertyName;
        private readonly bool allowEqualDates;

        public IsDateAfter(string testedPropertyName, bool allowEqualDates = false)
        {
            this.testedPropertyName = testedPropertyName;
            this.allowEqualDates = allowEqualDates;
        }

        protected override ValidationResult IsValid(object value, ValidationContext validationContext)
        {
            var propertyTestedInfo = validationContext.ObjectType.GetProperty(this.testedPropertyName);
            if (propertyTestedInfo == null)
            {
                return new ValidationResult(string.Format(&quot;unknown property {0}&quot;, this.testedPropertyName));
            }

            var propertyTestedValue = propertyTestedInfo.GetValue(validationContext.ObjectInstance, null);

            if (value == null || !(value is DateTime))
            {
                return ValidationResult.Success;
            }

            if (propertyTestedValue == null || !(propertyTestedValue is DateTime))
            {
                return ValidationResult.Success;
            }

            // Compare values
            if ((DateTime)value &gt;= (DateTime)propertyTestedValue)
            {
                if (this.allowEqualDates)
                {
                    return ValidationResult.Success;
                }
                if ((DateTime)value &gt; (DateTime)propertyTestedValue)
                {
                    return ValidationResult.Success;
                }
            }

            return new ValidationResult(FormatErrorMessage(validationContext.DisplayName));
        }

        public IEnumerable&lt;ModelClientValidationRule&gt; GetClientValidationRules(ModelMetadata metadata, ControllerContext context)
        {
            var rule = new ModelClientValidationRule
            {
                ErrorMessage = this.ErrorMessageString,
                ValidationType = &quot;isdateafter&quot;
            };
            rule.ValidationParameters[&quot;propertytested&quot;] = this.testedPropertyName;
            rule.ValidationParameters[&quot;allowequaldates&quot;] = this.allowEqualDates;
            yield return rule;
        }

CalendarEntry class:
...

    public virtual DateTime StartDate { get; set; }
        
    [IsDateAfter(&quot;StartDate&quot;, true, ErrorMessage=&quot;End date needs to be after start date&quot;)]
    public virtual DateTime EndDate { get; set; }


VIEW:

    $.validator.unobtrusive.adapters.add(
        &#39;isdateafter&#39;, [&#39;propertytested&#39;, &#39;allowequaldates&#39;], function (options) {
        options.rules[&#39;isdateafter&#39;] = options.params;
        options.messages[&#39;isdateafter&#39;] = options.message;
    });
    $.validator.addMethod(&quot;isdateafter&quot;, function(value, element, params) {
        alert(params.propertytested);
        var startdatevalue = $(&#39;input[name=&quot;&#39; + params.propertytested + &#39;&quot;]&#39;).val();
        if (!value || !startdatevalue) return true;
        return (params.allowequaldates) ? Date.parse(startdatevalue) &lt;= Date.parse(value) : Date.parse(startdatevalue) &lt; Date.parse(value);
    }, &#39;&#39;);

This works fine when the **CalendarEntry** is not wrapped inside another class. HOWEVER, when I use a view model like so:

        public class TrainingDateEditViewModel
        {
            #region Properties
    
            /// &lt;summary&gt;
            /// Gets or sets CalendarEntry.
            /// &lt;/summary&gt;
            public CalendarEntry CalendarEntry { get; set; }
    ....


The client validation no longer works because the html output produced is this:

    &lt;input type=&quot;text&quot; value=&quot;&quot; name=&quot;CalendarEntry.EndDate&quot; id=&quot;CalendarEntry_EndDate&quot; data-val-isdateafter-propertytested=&quot;StartDate&quot; data-val-isdateafter-allowequaldates=&quot;True&quot; data-val-isdateafter=&quot;End date needs to be after start date&quot; data-val=&quot;true&quot;&gt;

And the 

    data-val-isdateafter-propertytested=&quot;StartDate&quot; and IT SHOULD BE: &quot;CalendarEntry.StartDate&quot;.

How would I make it so that it would know to bind to &quot;CalendarEntry.StartDate&quot;
rule.ValidationParameters[&quot;propertytested&quot;] = this.testedPropertyName; // HERE IT SHOULD BE FULL NAME??? HOW??


thanks


MVC custom validation: compare two dates

I have a page we can call `parent.php`. In this page I have an `iframe` with a submit form and outside of that I have a div with the id &quot;target&quot;. Is it possible to submit the form in the iframe and when success refresh the target div. Say load a new page into it or something?

Edit:
The target div is in the parent page, so my question is basically if you can make for an example a jQuery call outside the iframe to the parent. And how that would look?

Edit 2:
So this is how my jquery code looks like now. It is in the &lt;head&gt; of the iframe page. the div #target is in the parent.php

    $(;&quot;form[name=my_form]&quot;).submit(function(e){	 
     e.preventDefault; 
     window.parent.document.getElementById(&#39;#target&#39;); 
     $(&quot;#target&quot;).load(&quot;mypage.php&quot;, function() { 
     $(&#39;form[name=my_form]&#39;).submit(); 
     }); 
     })

I don&#39;t know if the script is active cause the form submits successfully but nothing happens to target.

Edit 3:

Now I&#39;m trying to call the parent page from a link within the iframe. And no success there either:

    &lt;a href=&quot;javascript:window.parent.getElementById(&#39;#target&#39;).load(&#39;mypage.php&#39;);&quot;&gt;Link&lt;/a&gt;

Access elements of parent window from iframe

&gt; **Possible Duplicate:**  
&gt; [When to Use Double or Single Quotes in JavaScript](https://stackoverflow.com/questions/242813/when-to-use-double-or-single-quotes-in-javascript)  

&lt;!-- End of automatically inserted text --&gt;

This is specifically for jQuery not JavaScript in general since I&#39;m not a JavaScript programmer and I&#39;m starting to learn jQuery.

With the release of jQuery 1.6 was there a specific change on using single or double quotes?

For example, would the following function work in jQuery 1.6?:

    $(&#39;.selector&#39;).show();

Or do I have to use double quotes?:

    $(&quot;.selector&quot;).show();

Thanks in advance for any clarification.

Single or Double quotes in jQuery




&lt;!-- begin snippet: js hide: false console: true babel: false --&gt;

&lt;!-- language: lang-js --&gt;

    $(document).ready(function() {
      //set initial state.
      $(&#39;#textbox1&#39;).val($(this).is(&#39;:checked&#39;));

      $(&#39;#checkbox1&#39;).change(function() {
        $(&#39;#textbox1&#39;).val($(this).is(&#39;:checked&#39;));
      });

      $(&#39;#checkbox1&#39;).click(function() {
        if (!$(this).is(&#39;:checked&#39;)) {
          return confirm(&quot;Are you sure?&quot;);
        }
      });
    });

&lt;!-- language: lang-html --&gt;

    &lt;script src=&quot;https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js&quot;&gt;&lt;/script&gt;
    &lt;input type=&quot;checkbox&quot; id=&quot;checkbox1&quot;/&gt;&lt;br /&gt;
    &lt;input type=&quot;text&quot; id=&quot;textbox1&quot;/&gt;

&lt;!-- end snippet --&gt;

Here `.change()` updates the textbox value with the checkbox status. I use `.click()` to confirm the action on uncheck. If the user selects cancel, the checkmark is restored but `.change()` fires before confirmation.

This leaves things in an inconsistent state and the textbox says false when the checkbox is checked.

How can I deal with the cancellation and keep textbox value consistent with the check state?

Content Type	Original Author	Original Content on Stackoverflow
Question	curly_brackets	View Question on Stackoverflow
Solution 1 - Javascript	lonesomeday	View Answer on Stackoverflow
Solution 2 - Javascript	MarutiB	View Answer on Stackoverflow
Solution 3 - Javascript	Brian Peacock	View Answer on Stackoverflow

Visible window height instead of $(window).height();

Javascript Problem Overview

Javascript Solutions

Solution 1 - Javascript

Solution 2 - Javascript

Solution 3 - Javascript

PHP json_encode class private members

Detect 32-bit or 64-bit of Windows

Attributions