vvvlad blognote: JavaScript

Showing posts with label JavaScript. Show all posts

Friday, April 2, 2021

VSCode debugging Django (python) website and javascript with breakpoints in both

I was looking for a way to make VSCode debugger to stop on breakpoints both in python and javascript while debugging Django app.

Python and templates breakpoints work well with django launch.json settings, but javascript breakpoints are ignored.

What I found is a workaround (I don’t know if this is just a standard way to do this, but feels like workaround), by using the `compouns` option in the launch.json.

It is basically an ability of VSCode to debug two apps in parallel. For example when you have a server/client app and you want to debug both simultaneously.

Anyway, for Django, I used a regular django config, and a chrome web debug for javascript:

A new option is then available in the Run and Debug dorpdown menu: "Django/Web"

This way it works great.

Wednesday, June 3, 2009

Set focus on control inside iFrame (jQuery)

//get the IFRAME element - note no hashes in the name, we're using browser functionality 
var iframeRef = document.getElementById("IFRAMEID"); 
//focus the IFRAME element 
$(iframeRef).focus(); 
//use JQuery to find the control in the IFRAME and set focus 
$(iframeRef).contents().find("#CONTROLID").focus();

Source

Friday, March 27, 2009

pageLoad() – check if partial refresh

function pageLoad(sender, args) 
{
    if (args.get_isPartialLoad()) 
    {
        alert(”Ajax call”);
    } 
    else 
    {
        alert(”PostBack or initial load”);
    }
}

Friday, February 6, 2009

How to manage ASP.NET validation from Javascript with jQuery

Just an example from the original article, but it is self explanatory

      
    <asp:DropDownList ID="ddlMimeType" runat="server">

       <asp:ListItem Value="mp3">audio/mpeg</asp:ListItem>

       <asp:ListItem Value="wma">audio/wma</asp:ListItem>

       <asp:ListItem Value="other">Other</asp:ListItem>

    </asp:DropDownList>

    <asp:TextBox id="txbOtherMimetype" runat="server" />

    <asp:RequiredFieldValidator id="valOtherMimetypeRequired" runat="server"

                       ControlToValidate="txbOtherMimetype" ForeColor="#990066"

                       ErrorMessage="You have to specify a custom mimetype." />

    <script type="text/javascript">

    $(document).ready(function()

    {

      $("#<%= ddlMimeType.ClientID %>").change(function() 

      {

        toggleOtherMimeType(this);

      });

    }

    function toggleOtherMimeType(elem)

    {

      if(elem!=undefined) 

      {

        if(elem.value=="other")

        {

          $("#<%= txbEnclosureOtherMimetype.ClientID %>").show();

          ValidatorEnable($("#<%= valEncOtherMimetypeRequired.ClientID %>")[0], true);

        }

        else

        {

          $("#<%= txbEnclosureOtherMimetype.ClientID %>").hide();

          ValidatorEnable($("#<%= valEncOtherMimetypeRequired.ClientID %>")[0], false);

        }

      }

    }

    </script>

Source

Friday, January 16, 2009

JavaScript: Parent -> Frame function calls

For this example I have 2 html pages:

Page1.html and Page2.html

If Page2 is shown as iframe inside Page1 and has this function:

     <script type="text/javascript">

            function showMessage(m) {

                document.getElementById("message").innerHTML = m;

            }

    </script>

Than it can be called from Page1 like this:

    <script type="text/javascript">

        window.onload = function() {

            window.frames[0].showMessage("Hello from Main Page in iFrame");

        };    

    </script>

Source

Friday, November 21, 2008

jQuery Array Iteration – $.each

jQuery $.each can be used in order to iterate over an array:

     $(document).ready(function() {

        var arr = [ "a", "b", "c", "d", "e" ];

        $.each(arr,function(index, item)

        {

            $('#list').append($( "<li>" + item + " at " + index +"</li>" ));

        });

    });

You should have a <ul> with id=list for this code to work:

    <ul id="list">

        <!--the items will be added here -->

    </ul>

The result is:

Here is the entire code:

    <html>

    <head>

        <title>jQuery Array Iteration</title>

        <script src="scripts/jquery/jquery-1.2.6.min.js" type="text/javascript"></script>

        <script type="text/javascript">

            $(document).ready(function() {

                var arr = [ "a", "b", "c", "d", "e" ];

                $.each(arr,function(index, item)

                {

                    $('#list').append($( "<li>" + item + " at " + index +"</li>" ));

                });

            });

        </script>

    </head>

    <body>

        <ul id="list">

                <!--the items will be added here -->

        </ul>

    </body>

    </html>

Important to note that this is not the same as $(‘DOMElement’).each().

Source

Saturday, July 19, 2008

Persisting data in a web app by using frames

Say you have your main page, which is just a frameset. All the navigation occurs within that frameset, such that going from page1 to page2 merely updates the frame's url, it doesn't re-create the host page. This leaves the host page intact, including it's JavaScript state. Therefore, you could have a JavaScript variable persist data between pages.

<html>
<head>
    <title>My App</title>
    <script language="javascript" type="text/javascript">
      var _javaScriptVar = null;
    </script>
</head>
<frameset>
      <frame src="Page1.aspx" id="mainFrame">
</frameset>
</html>

You could then reference this variable from your child pages via the DOM:

window.parent._javaScriptVar = "someValue";

Source

Sys.WebForms.PageRequestManager.getInstance().add_endRequest(endRequestHandler);

2. Callback function:

function endRequestHandler(sender, eventArgs)
{
    if (eventArgs.get_error() != undefined && eventArgs.get_error().httpStatusCode == '500')
    {
        var error Message = eventArgs.get_error().message;
        eventArgs.set_errorHandler(true);
        alert(errorMessage);
    } else
    {
        //alert($get("hidField").value);
    }
}

Saturday, March 22, 2008

Pop-up a Confirmation box before Deleting a row in GridView

<asp:TemplateField>
      <ItemTemplate>
        <asp:Button ID="btnDel" runat="server" Text="Delete"
            CommandName="Delete" OnClientClick="return confirm('Are you sure you want to delete the record?');" />
      </ItemTemplate>
</asp:TemplateField>

Source

Friday, April 2, 2021

VSCode debugging Django (python) website and javascript with breakpoints in both

Wednesday, June 3, 2009

Set focus on control inside iFrame (jQuery)

Friday, March 27, 2009

pageLoad() – check if partial refresh

Friday, February 6, 2009

How to manage ASP.NET validation from Javascript with jQuery

Friday, January 16, 2009

JavaScript: Parent -> Frame function calls

Friday, November 21, 2008

jQuery Array Iteration – $.each

Saturday, July 19, 2008

Persisting data in a web app by using frames

Wednesday, March 26, 2008

Using the ASP.NET AJAX PageRequestManager to Provide Visual Feedback

Creating Custom ASP.NET Server Controls with Embedded JavaScript

Catch the end request of UpdatePanel

Saturday, March 22, 2008

Pop-up a Confirmation box before Deleting a row in GridView