samedi 27 juin 2015

JavaScript OnChange load another JSP page

I have a Jsp page on which there is a form form1 with a dropdownlist and I have included another Jsp page containing another form form2 to this page. I want that the form2 should be visible only when a particular element(say opt2) on the dropdownlist of form1 is selected.

Please see the code structure below:

<div id="somediv1">
    <%@ include file="../form2.jsp"%>
</div>
<form id="form1">
    <select  id="list1">
    <option>opt1</option>
    <option>Opt2</option>
    <option>opt3</option>
    <option>opt4</option>
    </select>

Team Treehouse nav bar animation

I am trying to reproduce the effects of the nav-bar animation when scrolling on their homepage. I understand how they can add classes when scrolling past a certain threshold with Jquery. Any ideas? If i try to animate links in the menu with opacity my content either overlaps, and if I use visibility it gets displaced.

Thank you.

PHP Countdown distribution

I am writing a randomized countdown that show number of products left in promotion alongside a timer. Number of products left is stored in the database, so all users see the same number. I am using simple php/ajax/javascript solution. My problem is with distributing the random sales so all fit within limited timer and are nicely distributed.

Here is code I have so far:

function start() {
    $date= new DateTime();
    $prod_left = getval("SELECT * FROM counter LIMIT 1");
    if ( $prod_left == 20 ) {
        $fp = fopen("../index.html", "r+");
        while($buf = fgets($fp)){
            if(preg_match("/<!--(.|\s)*?-->/", $buf)){
                fputs($fp, '<script type="text/javascript">$(document).ready(function() {$(".countdown").circularCountdown({startDate:"' . $date->format('Y/m/d H:i:s') . '",endDate:"' . $date->modify("+5minutes")->format('Y/m/d H:i:s') . '",timeZone:+2});});</script></body></html>');
            }
        }
        fclose($fp);
        sleep(30);
        while ($prod_left > 0) {
            if (rand(0,4) > 2) {
                $prod_left--;
                sleep(rand(1,13));
                updateval($prod_left);
            }
        }

    } else {
        echo 'Promocja w trakcie lub zakończona, zresetuj zegar, jeżeli chcesz rozpocząć ponownie';
    }
    exit;
}

My assumption here is: 50% of time decrease timer and wait on average 6.5 seconds, which should on average give me 260 seconds for full sale. Unfortunately its very unevenly distributed. My goal is to have the sale completed not later than 270seconds after start. Will you be able to help?

Implementation doesnt need to be in any particular programing language, im just looking for a clue/concept I can follow to achieve this.

What is the strangest, the $prod_left value not always goes to 0, on sime iterations it just sits at 3 or 5.

Please help!

Passing File path to MVC controller from View with Ajax J query return null

I'm trying to upload a image using MVC 5 and Ajax Jquery (asynchronously) but value of image variable always return null,

i already checked some previous stack overflow posts regarding this issue but i could not find my mistake, can anyone help me,

please help,,

Model Class

 public class TravelCategoryCustom
        {
            public int categoryId { get; set; }
            public string categoryName { get; set; }
            public string categoryDescriprion { get; set; }
            public HttpPostedFileBase image { get; set; }
            public int TotalPlaces { get; set; }
        }

View

<form enctype="multipart/form-data">
                <div class="form-group">
                    <label>Category Name</label>
                    @Html.TextBoxFor(model => model.categoryName, new { @class = "form-control" })

                </div>
                <div class="form-group">
                    <label>Category Description</label>
                    @Html.TextAreaFor(model => model.categoryDescriprion, 5, 1, new { @class = "form-control " })
                </div>
                <div class="form-group">
                    <label>Category Image</label>
                     <input type="file" id="dialog" />
                </div>

                <input type="button" value="Create" id="submtt" class="btn btn-primary" onclick="favfunct()" />

            </form>   

Script

<script>
    function favfunct() {
    $.ajax({
  var formData = new FormData($('form')[0]);
        url: "/MVCTravelCategories/Create",
        dataType: "json",
        type: "POST",
        contentType: 'application/json; charset=utf-8',
        data: JSON.stringify({ trvlcategory: { categoryId: '1', categoryName: 'testName', categoryDescriprion: 'TestDec', image: formData , TotalPlaces: '3' } }),
        async: true,
        processData: false,
        cache: false,
        success: function (data) {
            alert(data);
        },
        error: function (xhr) {
            alert('error');
        }
    });
    }
</script>

How to disable JQuery waypoints on click menu item?

I have read all the questions and answers on this topic. This should be a simple task, but I cannot get it to work.

JQuery version of Waypoints is working fine on top menu items, on one page site. I want to disable it upon clicking these menu items, and then restore it. I haven't gotten to the restore part yet. When I call the disable function I get a "TypeError: e.disable not a function". Commented lines show all the ways I have tried to include the disable() function:

var waypoints = $('section.waypoint').waypoint({
    handler:function(){
    var hash = '#'+this.element.id;     
    $('#menu-main-menu li.active').removeClass('active');
    $('#menu-main-menu li a[href='+ hash +']').parent('li').addClass('active');
    window.console.log($(window).scrollTop());
    if($(window).scrollTop() < 500){
    $('#menu-main-menu li.active').removeClass('active');
    }

    //$('#menu-main-menu li a').on('click', function(){
    //this.disableAll();
    //});
},
offset: '30%',
continuous: false

});

//waypoints.disable();

$('.jumbotron a, #menu-main-menu li a').on('click', function(e) {
e.preventDefault();
//waypoints.disable();
//waypoints.disableAll();
$('#menu-main-menu li.active').removeClass('active');

if (location.pathname.replace(/^\//,'') === this.pathname.replace(/^\//,'') && location.hostname === this.hostname) {
var $target = $(this.hash);
$target = $target.length && $target || $('[name="' + this.hash.slice(1) +'"]');
if ($target.length) {
var targetOffset = $target.offset().top - 45; 
$('html, body').animate({scrollTop: targetOffset}, 1000);
}
}    
});

I realize that waypoints is an array, so have tried disableAll() and iteration. No dice. Thanks in advance for your help!

Calling function inside jQuery returns wrong result

I have the following javascript code that runs fine if called outside the jQuery function on the bottom. I don't know what I am doing wrong.

Bresenham Algorithm:

function bresenham(x0,y0,x1,y1){
        var bresenham = [];
        
  var x=0;
        var dx = x1-x0;
        var dy = y1-y0;
        
        var D = 2*dy - dx;
        bresenham.push(x0 + "," + y0);
        var y=y0;
        
        for (x = x0+1;x<=x1;x++){
                        if (D>0){
                                        y = y+1;
                                        bresenham.push(x + "," + y);
                                        D = D + (2*dy - 2*dx);
                        } else {
                                        bresenham.push(x + "," + y);
                                        D = D + (2*dy);
                        }
        }
  return bresenham;
};

JQuery:

$(document).ready(function(){
        $(".button").click(function(){
                $("div#output p").remove();
                
                var x0 = $('input[name=x0]').val();
                var y0 = $('input[name=y0]').val();
                var x1 = $('input[name=x1]').val();
                var y1 = $('input[name=y1]').val();

                var bres = bresenham(x0,y0,x1,y1);
                console.log(bres);
        });
});

If I input: x0 = 1, y = 0 and x1 = 15, y2 = 9 it outputs: ["1,0", "11,01", "12,01", "13,011", "14,0111", "15,0111"]

Stuck with multi click event

I am stuck with the following. I have a play button. When the user clicks the first time on it, it should play the song and add a pause button to it. The second time you click on the button, it should pause the song.

Came up with this:

$('.play').click(function(event) {
        event.preventDefault();

        var trackID = $(this).closest('li').attr('data-id');
        console.log(trackID);

        $('#playlist li').removeClass('active');
        $(this).parent().addClass('active'); 


        if ( $(this).hasClass('play pause') ) {
            console.log('false');
            $(this).removeClass('pause');
        } else {
            console.log('true');
            $(this).addClass('pause');
            //return false;
        }

        if (nowPlaying) {
            nowPlaying.stop();
        }


        SC.stream('/tracks/' + trackID, function(sound) {
            if ( !$(this).hasClass('play pause') ) {
                console.log('hellooo');
                sound.play();
                nowPlaying = sound;
            } else {
                console.log('byeee');
                sound.pause();
                nowPlaying = sound;
            }
        });

   });

The above part will work correct. Play is the default of the button. When click the console.log send me the trackID: 91298058, true, and the string hellooo inside the stream function and the song is playing. The second time it will give me also the trackID 91298058, false and also the string hellooo. So the bug is here. Whenever you click the string hellooo will be send to the console.log. And the console.log - byeee will never be send and thus never be paused.

So in short, I would like to have one button that switch from play to pause and reverse. At play it should play the song: sound.play(); and at pause it should pause the song: sound.pause();;

Does anyone know how to fix this issue?

changing text input to select in wordpress using jQuery

I am using a WordPress module abase to get some data from database and send them to a form. The problem is, that abase form does not allow to use select input. Because of that I am trying to convert text input to a select. I created function toSelect, to which I pass id of element and list of options (for testing I put id of element to function definition).

function toSelect(itemid,valuelist) {
    var out = '';
    out += '<select id="bus311mtd_2_status" style="width:50px;">';
    for (i=0; i < valuelist.length; i++) {
        out += '<option value="'+valuelist[i]+'">'+valuelist[i]+'</option>';
    }
    out += '</select>';
    alert(out);
    $("#bus311mtd_2_status").replaceWith(out);
    //$("#bus311mtd_2_status").replaceWith('<input type="text" value="zamontowane">');
}

alert(out) gives nice select input code, but $("#bus311mtd_2_status").replaceWith(out) does not work.

Even something like: $("#bus311mtd_2_status").replaceWith('<input type="text" value="zamontowane">') doesn't work.

Element with id bus311mtd_2_status for sure exists (i.e. changing its value using document.getElementById() works fine)

Maybe jQuery doesn't work?

How can i make a function which has a multidimensional array input, transforms it, and ouputs the new multidimensional array

Input & Output

Back story

(my english isnt the best)

Hey, im trying to build a game that will teach children about words and letters. Im making it with HTML/CSS & JS(little JQuery) and a little PHP. I have build a tree that holds leaves with letters inside it. I want to build lots of levels, but i would have to type a very big array myself(and i know it should be possible to do it automatic).

I would really appreciate some help!


Problem

I have a multidimensional array which looks like this:

var words = [
    [
        ['SNEL'],
        ['WORD'],
        ['TIJD'],
        ['BORD'],
        [etc]
    ],
    [
        [BORDE]
        [etc]
    ],
    [
        etc
    ],
    [
        ['BEWUSTER']
    ]
];

Im trying to build a function that will output this into:

var modifiedWords1 = [
    [
        ['img/Letters_normal/S.png', 'img/Letters_normal/N.png', 'img/Letters_normal/E.png', 'img/Letters_normal/L.png'],
        ['img/Letters_normal/W.png', 'img/Letters_normal/O.png', 'img/Letters_normal/R.png', 'img/Letters_normal/D.png'],
        [img/Letters_normal/etc]
    ],
    [
        ['img/Letters_normal/B.png', 'img/Letters_normal/O.png', 'img/Letters_normal/R.png', 'img/Letters_normal/D.png', 'img/Letters_normal/E.png']
        [etc]
    ],
    [
        etc
    ],
    [
        ['img/Letters_normal/B.png', 'img/Letters_normal/E.png', 'img/Letters_normal/W.png', 'img/Letters_normal/U.png', 'img/Letters_normal/S.png', 'img/Letters_normal/T.png', 'img/Letters_normal/E.png', 'img/Letters_normal/R.png']
    ]
];

And this:

var Modifiedwords2 = [
    [
        ['S.png', 'N.png', 'E.png', 'L.png'],
        ['W.png', 'O.png', 'R.png', 'D.png'],
        ['T.png', 'I.png', 'J.png', 'D.png'],
        ['B.png', 'O.png', 'R.png', 'D.png'],
        [etc]
    ],
    [
        ['B.png', 'O.png', 'R.png', 'D.png', 'E.png']
        [etc]
    ],
    [
        etc
    ],
    [
        ['B.png', 'E.png', 'W.png', 'U.png', 'S.png', 'T.png', 'E.png', 'R.png']
    ]
];


Sorry for my bad english, but thanks in advance! Feel free to ask anything!

jQuery mobile pop up adding &ui-state=dialog at the end of url

I was using this sample code from jquery mobile semo example.

<a href="#popupMenu" data-rel="popup" data-transition="slideup" class="ui-btn ui-corner-all ui-shadow ui-btn-inline ui-icon-gear ui-btn-icon-left ui-btn-a">Actions...</a>
<div data-role="popup" id="popupMenu" data-theme="b">
        <ul data-role="listview" data-inset="true" style="min-width:210px;">
            <li data-role="list-divider">Choose an action</li>
            <li><a href="#">View details</a></li>
            <li><a href="#">Edit</a></li>
            <li><a href="#">Disable</a></li>
            <li><a href="#">Delete</a></li>
        </ul>
</div>

I i run this sample in jquery mobile site it works well but if i run it in my local system &ui-state=dialog is appended to the window url.

php ajax check if user exist

I am trying to see if the page title available for use. I'm trying to do this with normal function for availability of a user name. The problem that every time I get a title available although it already exists in a database. I am writing in Hebrew, all relevant pages are encoded UTF8. I do not know what to do, I'd love to help.

add_new_page.php:

<form role="form" data-toggle="validator" method="post" action="<?echo "$_SERVER[REQUEST_URI]";?>">
    <div class="form-group"><span id="frm_page_name_result"></span>
      <label for="frm_page_name"><?echo $lang['page_name']?>: <a data-toggle="modal" href="help/help_page_name.html" data-target="#HelpModal" class="glyphicon glyphicon-question-sign"></a></label>

     <input type="text" name="frm_page_name" id="frm_page_name" class="form-control" data-minlength="4" required />
    </div>

    <button type="submit" class="btn btn-success btn-lg" name="submit">אישור</button>
</form>

custom.js:

//check if page name exsist
$(document).ready(function() {

$("#frm_page_name").keyup(function (e) {

    //removes spaces from username
    //$(this).val($(this).val().replace(/\s/g, ''));

    var username = $(this).val();
    if(username.length < 2){$("#frm_page_name_result").html('');return;}

    if(username.length >= 2){
        $("#frm_page_name_result").html('<img src="images/ajax-loader.gif" />' );
        $.post('helpers/check_exists.php', {'username':username}, function(data) {
          $("#frm_page_name_result").html(data);
        });
    }
 });    
});

check_exists.php

<?php
###### db ##########
$db_username = '****';
$db_password = '****';
$db_name = '****';
$db_host = 'localhost';
 ################

 //check we have username post var
 if(isset($_POST["username"]))
 {
   $username=$_POST["username"];

   //check if its ajax request, exit script if its not
   if(!isset($_SERVER['HTTP_X_REQUESTED_WITH']) AND      strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) != 'xmlhttprequest') {
    die();
 }

//try connect to db
$connecDB = mysqli_connect($db_host, $db_username, $db_password,$db_name)or die('could not connect to database');
$connecDB->set_charset("utf-8");
//trim and lowercase username
 $username =  strtolower(trim($_POST["username"])); 

//sanitize username
//$username = filter_var($username, FILTER_SANITIZE_STRING, FILTER_FLAG_STRIP_LOW|FILTER_FLAG_STRIP_HIGH);
//check username in db
$results = mysqli_query($connecDB,"SELECT * FROM pages WHERE page_name='$username'");

//return total count
$username_exist = mysqli_num_rows($results); //total records

//if value is more than 0, username is not available 
if($username_exist) {
    die('not-available');
}else{
    die('available');
}

//close db connection
mysqli_close($connecDB);
}

?>

Text instead of thumbnails plupload

I have text (JPG, PNG, etc.) ( http://ift.tt/1eQjqnb )instead of thumbnails plupload jQuery. How can i repair this? I want thumbs, any idea? It's my code:

$( document ).ready(function() {
    $("#uploader").plupload({
        runtimes : 'html5,flash,silverlight,html4',
        url : "upload.php",
        max_file_size : '5mb',
        chunk_size: '1mb',
        resize : {
            width : 2000,
            height : 2000,
            quality : 90,
            crop: false,
            preserve_headers: false
        },
        filters : [
            {title : "Zdjęcia", extensions : "jpg,gif,png"},
            {title : "Archiwa Zip", extensions : "zip,avi"}
        ],
        rename: true,
        sortable: true,
        dragdrop: true,
        views: {
            list: true,
            thumbs: true, // Show thumbs
            active: 'thumbs'
        },
        flash_swf_url : '../js/Moxie.swf',
        silverlight_xap_url : '../js/Moxie.xap'
    });
});

Select2 not showing selected value

I have looked endlessly on here and everywhere else for a while, and I cannot figure out why my Select2 dropdown boxes aren't changing the value they display after I click it out of the dropdown.

I am trying to style the woocommerce product selection boxes using Select2 - I have them all styled, but now they don't seem to actually work. How I am initializing my two boxes:

<script src="http://ift.tt/1GEtfQr"></script>
<link    href="//cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/css/select2.min.css" rel="stylesheet" />
<script src="//cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/js/select2.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$("#current-rank").select2({
allowClear: true,
multiple: false,
width: 150
});
$("#desired-rank").select2({
allowClear: true,
multiple: false,
width: 150
});
});
</script>

HTML of the product page relevant to the dropdown (so yes all my options have an ID that Select2 should be able to use...)

    <td class="value">
    <select id="current-rank" name="attribute_current-rank" data-attribute_name="attribute_current-rank" tabindex="-1" class="select2-hidden-accessible" aria-hidden="true">
        <option id="select-a-rank" selected="selected" value="select-a-rank">Select a Rank</option>         <option id="rank-2" value="rank-2">Rank 2</option>         <option id="rank-3" value="rank-3">Rank 3</option>         <option id="rank-4" value="rank-4">Rank 4</option>         <option id="rank-5" value="rank-5">Rank 5</option>         <option id="rank-6" value="rank-6">Rank 6</option>         <option id="rank-7" value="rank-7">Rank 7</option>         <option id="rank-8" value="rank-8">Rank 8</option>         <option id="rank-9" value="rank-9">Rank 9</option>         <option id="rank-10" value="rank-10">Rank 10</option>         <option id="rank-11" value="rank-11">Rank 11</option>         <option id="rank-12" value="rank-12">Rank 12</option>         <option id="rank-13" value="rank-13">Rank 13</option>         <option id="rank-14" value="rank-14">Rank 14</option>         <option id="rank-15" value="rank-15">Rank 15</option>         <option id="rank-16" value="rank-16">Rank 16</option>         <option id="rank-17" value="rank-17">Rank 17</option>         <option id="rank-18" value="rank-18">Rank 18</option>         <option id="rank-19" value="rank-19">Rank 19</option>         <option id="rank-20" value="rank-20">Rank 20</option>         <option id="rank-21" value="rank-21">Rank 21</option>         <option id="rank-22" value="rank-22">Rank 22</option>         <option id="rank-23" value="rank-23">Rank 23</option>         <option id="rank-24" value="rank-24">Rank 24</option>         <option id="rank-25" value="rank-25">Rank 25</option>         <option id="rank-26" value="rank-26">Rank 26</option>         <option id="rank-27" value="rank-27">Rank 27</option>         <option id="rank-28" value="rank-28">Rank 28</option>         <option id="rank-29" value="rank-29">Rank 29</option>         <option id="rank-30" value="rank-30">Rank 30</option>         <option id="rank-31" value="rank-31">Rank 31</option>         <option id="rank-32" value="rank-32">Rank 32</option>         <option id="rank-33" value="rank-33">Rank 33</option>         <option id="rank-34" value="rank-34">Rank 34</option>         <option id="rank-35" value="rank-35">Rank 35</option>         <option id="rank-36" value="rank-36">Rank 36</option>         <option id="rank-37" value="rank-37">Rank 37</option>         <option id="rank-38" value="rank-38">Rank 38</option>         <option id="rank-39" value="rank-39">Rank 39</option>         <option id="rank-40" value="rank-40">Rank 40</option>         <option id="rank-41" value="rank-41">Rank 41</option>         <option id="rank-42" value="rank-42">Rank 42</option>         <option id="rank-43" value="rank-43">Rank 43</option>         <option id="rank-44" value="rank-44">Rank 44</option>         <option id="rank-45" value="rank-45">Rank 45</option>         <option id="rank-46" value="rank-46">Rank 46</option>         <option id="rank-47" value="rank-47">Rank 47</option>         <option id="rank-48" value="rank-48">Rank 48</option>         <option id="rank-49" value="rank-49">Rank 49</option>         <option id="rank-50" value="rank-50">Rank 50</option>
    </select>
    <span class="select2 select2-container select2-container--default select2-container--below" dir="ltr" style="width: 150px;">
        <span class="selection">
            <span class="select2-selection select2-selection--single" role="combobox" aria-autocomplete="list" aria-haspopup="true" aria-expanded="false" tabindex="0" aria-labelledby="select2-current-rank-container">
                <span class="select2-selection__rendered" id="select2-current-rank-container" title="Select a Rank">
                    <span class="select2-selection__clear">×</span>Select a Rank
                </span>
                <span class="select2-selection__arrow" role="presentation">
                    <b role="presentation"></b>
                </span>
            </span>
    </span>
        <span class="dropdown-wrapper" aria-hidden="true"></span>
    </span>
</td>

I have no clue why this isn't working, the main possible issue I have found is that Select2 has no ID to call an item by, but I have made sure an ID gets generated by WooCommerce when loading the page.

I don't think Select2:select is firing but not sure why, as "selected" isn't changed on an item click.

Is it correct update client side object with angular.copy response

I have an import functionality client side page with display 'Save button' or 'Saved lable' depends on entity`s id.

enter image description here

Here is my save function: response of it is created on server side, stored into database and selected after that object (after save i'd like to display stored value, which one should already have id (auto_increment PK)):

enter image description here

So, after i saved order and got response with stored value, i need to update passed as argument order (to set order's id, so that's saving button gone invisible and saved label showed).

I did it with angular.copy(entity, order), but is it correct and is there other practices with applying and displaying stored value from response.

Javascript image dropdown set background color

I want to use in an html page, generated from PHP, the combobox like in Java. I want to add an icon, some text, some additional text and a background color. The data can ben generated from a JSON file or with a query in PHP, from a MySQL DB. I've found this very powerful solution, which can be a good starting point. The only problem I'm not able to fix, it is about the background color of the select/li. In fact, I want that they are different from white, and are related with a variable, which is present in the JSON file. How Can I set the background color of each select, dynamically with the actual code ?

enter image description here

A small help . how i will convert book.xml file which is attached in my solution to xml string like C++170 Actually i need to convert book.xml file to json data. there are many examples which is converting xml string to json. but not xml file (book.xml) to json. can anybody please help me to convert a specific xml file to xml string

Chained select and submit to target text to another div [on hold]

I need Help with Java code ... I have chained select on my subpage , select have 3 lvl's my point is when i choose first and second lvl i want button submit to be not clickable only when i choose all three lvl's button will be active. And second is to how to do that when I'am On 3 lvl choose one option go with submit and result is to show text(dedicated to this option) lower in page in div ?

<!DOCTYPE>
<html>
<head>
<script src="js/jquery-1.9.1.min.js"></script>
<script src="js/jquery.chained.min.js"></script>
<script charset=utf-8>
  $(function(){
      $("#series").chained("#mark");
      $("#model").chained("#series");

  });
  </script>
    </head>

<body>
<div class="chained">
<select id="mark" name="mark">
  <option value="">--</option>
  <option value="Ciezarowe">Ciezarowe</option>
  <option value="Autobusy">Autobusy</option>
  <option value="Maszyny">Maszyny</option>
  <option value="Indywidualne">Indywidualne</option>
</select>
<select id="series" name="series">
  <option value="">--</option>
  <option value="Ford" class="Ciezarowe">Ford</option>
  <option value="Mercedes" class="Ciezarowe">Mercedes</option>
  <option value="Peugeot" class="Ciezarowe">Peugeot</option>
  <option value="Ikar" class="Autobusy">Ikar</option>
  <option value="Iveco" class="Autobusy">Iveco</option>
  <option value="Man" class="Autobusy">Man</option>
  <option value="Komatsu" class="Maszyny">Komatsu</option>
  <option value="Nissan" class="Maszyny">Nissan</option>
  <option value="Still" class="Maszyny">Still</option>
  <option value="Pojedyncze" class="Indywidualne">Pojedyncze</option>
  <option value="Grupowe" class="Indywidualne">Grupowe</option>
  <option value="Firmowe" class="Indywidualne">Firmowe</option>
</select>
<select id="model" name="model">
  <option value="">--</option>
  <option value="F1" class="Ford">F1</option>
  <option value="F2" class="Ford">F2</option>
  <option value="F3" class="Ford">F3</option>
  <option value="S1" class="Mercedes">S1</option>
  <option value="S2" class="Mercedes">S2</option>
  <option value="S3" class="Mercedes">S3</option>
  <option value="P1" class="Peugeot">P1</option>
  <option value="P2" class="Peugeot">P2</option>
  <option value="P3" class="Peugeot">P3</option>
  <option value="I1" class="Ikar">I1</option>
  <option value="I2" class="Ikar">I2</option>
  <option value="I3" class="Ikar">I3</option>
  <option value="V1" class="Iveco">V1</option>
  <option value="V2" class="Iveco">V2</option>
  <option value="V3" class="Iveco">V3</option>
  <option value="M1" class="Man">M1</option>
  <option value="M2" class="Man">M2</option>
  <option value="M3" class="Mano">M3</option>
  <option value="K1" class="Komatsu">K1</option>
  <option value="K2" class="Komatsu">K2</option>
  <option value="K3" class="Komatsu">K3</option>
  <option value="N1" class="Nissan">N1</option>
  <option value="N2" class="Nissan">N2</option>
  <option value="N3" class="Nissan">N3</option>
  <option value="S1" class="Still">S1</option>
  <option value="S2" class="Still">S2</option>
  <option value="S3" class="Still">S3</option>
  <option value="P1" class="Pojedyncze">P1</option>
  <option value="P2" class="Pojedyncze">P2</option>
  <option value="P3" class="Pojedyncze">P3</option>
  <option value="G1" class="Grupowe">G1</option>
  <option value="G2" class="Grupowe">G2</option>
  <option value="G3" class="Grupowe">G3</option>
  <option value="F1" class="Firmowe">F1</option>
  <option value="F2" class="Firmowe">F2</option>
  <option value="F3" class="Firmowe">F3</option>
</select>
 <button id="button" type="submit">Wyswietl</button>
 </div>
 <div class="content">

 </div>
 </body>
</html>

For First thanks for your answers i damm noob in Java ... Second I hope i Past good this html code and dont brake any rules here in Stackoverflow if not im sory but im new here i know this is no excuse ... I count on your understanding

Cheers

Phonegap - table rows clickable?

I am using Phonegap, and trying to make a table whose rows are clickable.

My index.html file looks like:

<head>
...
</head>

<body>
    <table id="daysOfWeek"></table>

    <script type="text/javascript" src="cordova.js"></script>
    <script type="text/javascript" src="js/index.js"></script>
    <script type="text/javascript">
        app.initialize();
    </script>
</body>

And js/index.js looks like:

var app = {
    initialize: function() {
        this.bindEvents();
    },

    bindEvents: function() {
        document.addEventListener('deviceready', this.onDeviceReady, false);
    },

    onDeviceReady: function() {
        var days = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'];

        days.forEach(function(day) {

            var dayRow = $('<tr class="dayRow"></tr>');
            $('#daysOfWeek').append(dayRow);

            dayRow.append('<td>' + day + '</td>');

        });

        $('body').on('touchstart', '.dayRow', function() {
            alert('table row clicked');
        });
    }
};

The issue is that, for some reason, only the last table row seems to detect the touch and produce the alert; touching the other table rows has no effect.

Any suggestions?

Thanks!

Maintain Markup Format with Highlight.js

I am attempting to display dynamically generated HTML on my web page and do highlighting/formatting using highlight.js. I have the highlighting working correctly, however the indentation is not correct. Here's the jsFiddle.

The code shows like this: <div class="parent">parentContent<div class="child">childContent</div><div class="child">childContent</div><div class="child">childContent</div></div>

whereas I'd like to show up as it would in an IDE:

<div class="parent">
    parentContent
   <div class="child">
       childContent
   </div>
   <div class="child">
       childContent
   </div>
   <div class="child">
       childContent
   </div>
</div>

I understand it's called highlight.js not format.js :) but I thought it was possible and I haven't had much luck getting an answer from the API. I have tried configuring line breaks via hljs.configure({ useBR: true }); and the fixMarkup('value') looked promising but I have not implemented it with any success.

window load function loads images fully?

$(window).load(function(){ 
// executes when complete page is fully loaded, 
//including all frames, objects and images 
}

What does it mean "images"? Does it mean both the "background images set in css" and "images set in document through img tag"?

Chart.js - draw horizontal line

I would like to draw a horizontal line in a chart (Chart.js), but I'm not able to do it. I read this question - Chart.js — drawing an arbitrary vertical line - and I can't transform the code for drawing horizontal lines (not vertical). I hope you can help me (especially potatopeelings :)).

jQuery - link hides div

I have this simple script

$(".showHide").click(function (e) {
    e.stopPropagation();
    $(".showHide").children('.showHide').toggle();
});

$(".modal-inside").click(function (e) {
    e.stopPropagation();
});

$(document).bind('keydown', function(e) { 
        if (e.which == 27) {
            $(".showHide").children('.showHide').hide();
        }
    });

I cant find out how I can make my link with class close to work. I want it to show .modal div with it.

working script is here http://ift.tt/1Jqienj

Click on checkbox inside a button element - Firefox issue

I wish to know the reason that why the below JS Fiddle works well in chrome but not In Firefox. Although nesting checkbox inside button might be wrong, But I'm only interest to know the theory behind working difference between chrome and firefox in context of my JS Fiddle.

JS Fiddle

$(function(){    
    $("button.tablesaw-sortable-btn").on("click",function(){        
        alert("button clicked");        
    });
    $("input#test").on("click",function(e){        
        e.stopPropagation();
    });
});

Stop execution for a sec

I have coded N-Queen problem using backtracking in javascript.

what I want to do?

I want to spot execution of script for a second every time it reaches to solution.

what is the problem?

code execution is so fast that i can not see any color transition.

here is a part of my code (where i want to spot execution of script for a second). for full code please refer to http://ift.tt/1HmOkxV

function placeQueen(row){
    for(var i=0;i<N && row<N;i++){
      chess[row][i] = 1;
      var temp = row*N+i+1;
      //place a Queen (red color)
      $('#'+temp).css("background-color","red");
      //check if place is safe
      if(check(row,i)){
        if(row==N-1){
           //place is safe and it is last row then
           //solution found 
           //stop execution for a second 
           //then continue
           print();
        }
        else{
          placeQueen(row+1);
        }
      }
      //remove the Queen (backtracking)
      $('#'+temp).css("background-color","blue");
      chess[row][i]=0;
    }
} 

Red color : queen is placed on the box blue color : box is empty

Any help would be appreciated.

How can i pass the file loaded using fileopen dialog in ajax request

I am opening an image from fileopen dialog using jquery. I want send the ajax request to a php page to upload the image to database. How can i do it. I am using the following code to open the image

$("#imgup").on("click",function(){
                $('#imgfile').trigger('click');
                var data=$("#imgfile").val();
            });

And here is my code that is the place where the input dialog is present

<div id="profilepic">
                <img id="profileimg" src="getImage.php" width="100" height="100"/>
                <p style="margin-top: -20px;" id="imgchng"><a id="imgup" href="#">Change Image</a></p>
                <input id="imgfile" type="file"/>
            </div>

Can anyone help? Thanks in advance

How to localstore and get value from TranslateX?

Hello i have these piece of code :

var note = $('#just-a-slider .handle');

updatePosition(note);

new Dragdealer('just-a-slider', {
animationCallback: function(x, y) {
$('#just-a-slider .value').text(Math.round(x * 100));

        var left = note.position().left;
        localStorage.setItem("left", left);

        console.log(left);

}
});


   function updatePosition(note) {

    var left = localStorage.getItem("left");
    note.css({ transform: "translateX " +left + "px" });

    }

But it doesn't work for some reasons.

  • The variable stored in left is good, and work if i write this :

    function updatePosition(note) {
    
    var left = localStorage.getItem("left");
    note.css({ left: left + "px" });
    
    }
    
    

    but not with :

    note.css({ transform: "translateX " +left + "px" });
    
    
  • For exemple this code work :

    var left = 100; //or xx;
    note.css({ transform: "translateX " +left + "px" });
    
    

So if think "transform" is not compatible with localstorage ? Am i wrong ?

What's the solution ? Thank you for the help.

(Sorry, i'm french)

Option values in dropdown select tag

I have two drop down select tags in one page.

The first dropdown box is called "states" and based off of what state is chosen...

The second dropdown will show the colleges in that state by having the same "VALUE"

What I am trying to do is to have a link based off of the college chosen:

  • is it possible to create another value to have a link for the college chosen? or is there another way to have create a link?

Remove error message of a particular field using jquery validate

I have a simple form that looks like below. I have clicked the Submit button once and all the jquery validation messages appear (as shown in red). However, upon unchecking the Call checkbox for Sports Event, I would like to remove all jquery validate messages associated to the Sports Event only. How can I do that? Currently, if I check the Call checkbox again, the validation messages are still shown.

form

Why does this Javascript populate forms okay in Chrome and Firefox, but not Internet Explorer?

This is my code to populate a fieldset:

var fData = JSON.parse(localStorage.getItem('Preferences'));
if (fData) {
  for (var pair in fData) {      
    $('[name=' + fData[pair].name + ']').val(fData[pair].value);                        
  }
}

It works fine in Chrome and Firefox but not IE - any reason why not? How do I fix?

How to maintain proper variable scope/value in function call nested in loop [duplicate]

This question already has an answer here:

I ran into a scope problem when dealing with generated HTML plus event handling from within a loop.

Imagine this scenario

# var container=$('#someContainerId');

_buildField=function(index){
    return $('<div/>').data('index', index);
};

for(var i=1; i<=10; i++){
    container.append( $('<div/>').on('click', function(){
        _buildField(i);
    } );
}

In this example, _buildField() will always receive the value 10, no matter which of the div elements is being clicked.

Quite honestly, i thought it to be different, but here we go again, learning something new.

QUESTION

How can i assure the passing of the correct value (current iteration stored in i) to _buildField()?

Event Capturing in Jquery

How do we stop event capturing in Jquery. I know all about event bubbling and event capturing in JavaScript but interested to know if Jquery has something similar to stop event capturing. If not, then how can I extend Jquery code for this additional functionality. Please guide. Thanks in adv.

Javascript click button1

Hi i have the following html code, and i'm truing to make a javascript to click on this button

<fieldset class="fields1"></fieldset>
<fieldset class="submit-buttons">
<some other button here >
<input class="button1" type="submit" value="Submit" name="post" tabindex="4" accesskey="f"></input>

What i already tried is the following options,

$(".submit-buttons").children('input[name="post"]').click();

doesn't work

and this way also, and this doesn't work neither

$("input[name=post]").click();

Is there any other way to click the button1, or is any way i can select tabindex4 or accesskey f, as these are values that wont change?, the problem is that i don't have any id button.

Thanks

How to hide a button from jQuery Dialog UI?

I am trying to hide a button from the jQuery UI dialog button when the dialog open. Then I want to show it if a condition met.

I wrote code in the open method that will add a css code to disable the button. I have also tried to call .show() and .hide() methods but that still did not work.

I am not sure how I would be able to hide/show a button in jQuery

Here is my code

function initializeDialog(){ 

    //initialize the dialog box
    $(".ICWSinboundDialog").dialog({
        resizable: true,
        width: 500,
        modal: true,
        autoOpen: false,
        stack: false,
        open: function(){
            $('#btnAnswerAndShow').css("display","none");

        },
        buttons: [
            {
            id: "btnAnswerAndShow",
            text: "Answer - Display",
            click: function(e) {
                  //do something
                }
            },
            {
            id: "btnAnswer",
            text: "Answer",
            click: function(e) {
                    //do something

                }
            },
            {
            id: "btnVM",
            text: "Send to Voice Mail",
            click: function(e) {
                    //do something
                }
            },
            {
            id: "btnHold",
            text: "Hold",
            click: function(e) {
                //do something
                }
            }
        ]
    });
}

The DIV for the dialogs are created on the fly like so

        var prefix = 'ICWS_';
        var interactionId = '123456';
        var dialogID = '#' + prefix + interactionId;

        //create a dialog box if one does not already exists
        if( $(dialogID).length == 0) {
            $('#ICWSDialogs').append('<div class="ICWSinboundDialog icwsDialogWrapper" id="'+ prefix + interactionId +'" style="display: none;"></div>');
        } 
        //initialize the dialog after creating the new dialog
        initializeDialog();

And later down the code I can open this dialog like so

if( $(dialogID).length > 0) {
     $(dialogID).dialog('open');
}

this is my HTML markup

<div id="ICWSDialogs"></div>

Using sketch.js I want to download more of the produced data

When I press the download key on it does not download the quote that is present. Is there a way to change this? I tried playing around with the "data-" tag but can get nothing to work.

Here is the code

<title>SNUGGLETOOTH</title>

<body>

    <nav>

        <div id="SketchTools">
    <!-- Basic tools -->
    <a href="#SketchPad" data-color="#000000" title="Black"><img src="img/black_icon.png" alt="Black"/></a>
    <a href="#SketchPad" data-color="#ff0000" title="Red"><img src="img/red_icon.png" alt="Red"/></a>
    <a href="#SketchPad" data-color="#00ff00" title="Green"><img src="img/green_icon.png" alt="Green"/></a>
    <a href="#SketchPad" data-color="#0000ff" title="Blue"><img src="img/blue_icon.png" alt="Blue"/></a>
    <a href="#SketchPad" data-color="#ffff00" title="Yellow"><img src="img/yellow_icon.png" alt="Yellow"/></a>
    <a href="#SketchPad" data-color="#00ffff" title="Cyan"><img src="img/cyan_icon.png" alt="Cyan"/></a>

    <!-- Advanced colors -->
    <a href="#SketchPad" data-color="#e74c3c" title="Alizarin"><img src="img/alizarin_icon.png" alt="Alizarin"/></a>
    <a href="#SketchPad" data-color="#c0392b" title="Pomegrante"><img src="img/pomegrante_icon.png" alt="Pomegrante"/></a>
    <a href="#SketchPad" data-color="#2ecc71" title="Emerald"><img src="img/emerald_icon.png" alt="Emerald"/></a>
    <a href="#SketchPad" data-color="#1abc9c" title="Torquoise"><img src="img/torquoise_icon.png" alt="Torquoise"/></a>
    <a href="#SketchPad" data-color="#3498db" title="Peter River"><img src="img/peterriver_icon.png" alt="Peter River"/></a>
    <a href="#SketchPad" data-color="#9b59b6" title="Amethyst"><img src="img/amethyst_icon.png" alt="Amethyst"/></a>
    <a href="#SketchPad" data-color="#f1c40f" title="Sun Flower"><img src="img/sunflower_icon.png" alt="Sun Flower"/></a>
    <a href="#SketchPad" data-color="#f39c12" title="Orange"><img src="img/orange_icon.png" alt="Orange"/></a>

    <a href="#SketchPad" data-color="#ecf0f1" title="Clouds"><img src="img/clouds_icon.png" alt="Clouds"/></a>
    <a href="#SketchPad" data-color="#bdc3c7" title="Silver"><img src="img/silver_icon.png" alt="Silver"/></a>
    <a href="#SketchPad" data-color="#7f8c8d" title="Asbestos"><img src="img/asbestos_icon.png" alt="Asbestos"/></a>
    <a href="#SketchPad" data-color="#34495e" title="Wet Asphalt"><img src="img/wetasphalt_icon.png" alt="Wet Asphalt"/></a>
   </br> <a href="#SketchPad" data-color="#ffffff" title="Eraser"><img src="img/eraser_icon.png" alt="Eraser"/></a>

    <!-- Size options -->
    <a href="#SketchPad" data-size="1"><img src="img/pencil_icon.png" alt="Pencil"/></a>
    <a href="#SketchPad" data-size="3"><img src="img/pen_icon.png" alt="Pen"/></a>
    <a href="#SketchPad" data-size="5"><img src="img/stick_icon.png" alt="Stick"/></a>
    <a href="#SketchPad" data-size="9"><img src="img/smallbrush_icon.png" alt="Small brush"/></a>
    <a href="#SketchPad" data-size="15"><img src="img/mediumbrush_icon.png" alt="Medium brush"/></a>
    <a href="#SketchPad" data-size="50"><img src="img/bigbrush_icon.png" alt="Big brush"/></a>
    <a href="#SketchPad" data-size="90"><img src="img/bucket_icon.png" alt="Huge bucket"/></a>

    <a href="#SketchPad" data-download='png' id="DownloadPng">Download</a>
    <br/>
  </div>
        <div class="links">
        <ul>
            <li><img src="ficon.png" alt="Facebook"></li>
            <li><img src="igramicon.png" alt="Instagram"></li>
            <li><img src="picon.png" alt="Pinterest"></li>
            <li><img src="mcicon.png" alt="Mixcloud"></li>
            <li><img src="twicon.png" alt="Twitter"></li>
        </ul>
    </div>

    <div class="message">

        <div data id="quote"></div>
  <script>
    (function() {
      var quotes = [
        { text: "Snuggletooth likes pancakes"},
        { text: "Would you like Snuggletooth to tuck you in?"},
        { text: " Snuggletooth loves you"},
        { text: "Snuggletooth is here for you"},
        { text: "Did you know that Snuggletooth </br>can be in 2 places at once?"},
        { text: "Heyyyy!<br> I was just thinking about you </br>Love Snuggletooth" },
        { text: "Wanna Sandwich??</br>xSnuggletooth"},
        { text: "Want some breakfast???</br> ;) Snuggletooth"},
        { text: "Snuggletooth-a-riffic!!!"},    
        { text: "Snuggletooth makes great popcorn!"},
        { text: "Come over to Snuggletooth's! He makes a great guacamole!"},
        { text: "Snuggletooth likes his bubblebaths to smell like bubblegum"},
        { text: "Snuggletooth wants to know what are you up to later?"},
        { text: "Snuggletooth-a-licious!!!"},
      ];
      var quote = quotes[Math.floor(Math.random() * quotes.length)];
      document.getElementById("quote").innerHTML =
        '<p>' + quote.text + '</p>' +
        '' +  '';
    })();
  </script>

    </div>
    </nav>
    <canvas id="SketchPad" width="1125" height="600">

    </canvas>
  </div>
  <script type="text/javascript">
    $(function() {
      $('#SketchPad').sketch();
    });
  </script>

Dynamic Select Choice using jquery

I have two choice boxes as follows,

<select name="first" id="first">
   <option value="0">First</option>
   <option value="1">Second</option>
   <option value="2">Third</option>
   <option value="3">Fourth</option>
   <option value="4">Five</option>
   <option value="5">Six</option>
   <option value="6">Seven</option>
</select>

Second Select box :

<select name="first" id="first">
   <option value="0">First</option>
   <option value="1">Second</option>
   <option value="2">Third</option>
   <option value="3">Fourth</option>
   <option value="4">Five</option>
   <option value="5">Six</option>
   <option value="6">Seven</option>
</select>

Now when I select "First" in first select box at that time I should not able to select First choice in second select box. If I select second in first choice then I should not able to select 1st and second from second list box, if third then I should not able to select first, second and third. So on.. How can I do it ?

Thanks!

Content script inject jquery only when current tab has no jquery

I found out if I inject jquery from manifest, jquery will be injected even current page has already jquery. How can I avoid injecting duplicate js libs such as jquery?

"content_scripts": [
{
        "js": [
                "bower_components/jquery/dist/jquery.min.js",
                "scripts/content/inject.js"
              ],
}

jQuery DataTables Initialization Server-Side

I've this code bellow to load contents from ashx handler wich generate the json to the table, but it doesn't work, it even don't call it, so this function is not doing a ajax call, only initializing the data table withou anything.

$('#tabela').dataTable({
 serverSide: true,
 ajax: {
  url: "handlers/ultimosTrabalhos.ashx",
  type: "GET"
 }
});

How can i call this in order to retrive the json data to the table?

How to pass parameters between forms in HTML?

I have a 2-step registration process which consists of 2 different HTML pages. The second (and final) step collects all the data and sends it to the server for evaluation. For simplicity, let's say I collect user's name in the first form and user's age in the second:

formA.html:

<form action="formb.html" method="get">
      Name: <input id="age" type="text" name="age">
      <input id="submit_button" type="submit" value="CONTINUE">
</form>

formB.html:

<form action="serverscript.py" method="post">
      Age: <input id="name" type="text" name="name">
      <input id="submit_button" type="submit" value="SUBMIT">
</form>

How can I "propagate" the "name" that user has entered in formA.html to formB.html so that I can send name,age to the server?

p.s. The only way I can thinkg is doing it with and then parsing the URL in formB , but that seems very ugly...

Correctly iterating through array and open pages with CasperJS

I'm working on a little project with CasperJS. The main idea is to get a links to pictures with title and description from subpages of some website. I already tried many different ways to achieve what I want, but I'm stuck with some piece of code and I don't want to continue with uncorrectly way of coding for "probably very easy thing". I just started using CasperJS, so I think that the solution to my problem must be easy.

This is current sequence of events in my code:

casper.start(url);
casper.thenEvaluate(openPicturesSubpage);
casper.then(getPicturesInfo);
casper.then(getPictureFullRes);
casper.run();

First two commands are working as expected, so I will skip to the structure of third function. The code of function (I'm using jQuery, because I need to get some specific stuff in other function) getPicturesInfo (variable pictures is global):

getPicturesInfo = function() {
  pictures = this.evaluate(function() {
    var array = [];
    $('.picture-box a').each(function() {
      arr.push({
        'name': $(this).text(),
        'subpage': $(this).attr('href')
      });
    });
    return array;
  });
}

Basically I have everything I need to continue "browsing" for actual full resolution links of pictures. So the next step is to append new data to already created array. This is also the main problem I want to solve. How to correctly iterate through array of previously saved data? So there's the code of the last function getPictureFullRes:

getPictureFullRes = function() {
  for (var i = 0; i < pictures.length; i++) {
    this.thenOpen(pictures[i]['subpage'], getFullResLink);
  }
}

The problem there is that I can't pass counter variable i to my nect function getFullResLink. I also tried to add another argument to thisOpen method and argument to getFullResLink function, but it doesn't work, because method don't have that functionallity.

How could I access appropriate index of array inside getFullResLink? Thanks for any help!

Scrolling circle bars on the right side?

I am trying to create a scrolling circles that navigates each section of my page like this: http://goo.gl/kAhj8J

However for some reason I don't how to start it with jQuery.

Here's my Markup:

<section class="background-fixed img-1" >
        <div class="main-content">
            <h2>Title here</h2>
            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Autem dolor beatae, laudantium eos fugiat, deserunt delectus quibusdam quae placeat, tempora ea? Nulla ducimus, magnam sunt repellendus modi, ad ipsam est.</p>
        </div>
    </section>

    <section class="background-fixed img-2">
        <div class="main-content">
            <h2>Title here</h2>
            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Autem dolor beatae, laudantium eos fugiat, deserunt delectus quibusdam quae placeat, tempora ea? Nulla ducimus, magnam sunt repellendus modi, ad ipsam est.</p>
        </div>
    </section>

    <section class="background-fixed img-3">
        <div class="main-content">
            <h2>Title here</h2>
            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Autem dolor beatae, laudantium eos fugiat, deserunt delectus quibusdam quae placeat, tempora ea? Nulla ducimus, magnam sunt repellendus modi, ad ipsam est.</p>
        </div>
    </section>

    <section class="background-fixed img-4">
        <div class="main-content">
            <h2>Title here</h2>
            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Autem dolor beatae, laudantium eos fugiat, deserunt delectus quibusdam quae placeat, tempora ea? Nulla ducimus, magnam sunt repellendus modi, ad ipsam est.</p>
        </div>

Here's the JSFIDDLE: http://ift.tt/1BLiQRn

Any ideas?

jQuery - object dissapears as soon as I put it in another page

Couldn't find about this problem, I guess it's not really a problem, just I don't know how to it. On the event of click on a certain div, I want to open it a new tab. I managed to do it in the following code, but what happens is the original div disappears from the original page and is showed only in the new tab, I'm not quite sure why this is happening, but I though about cloning the object - but wasn't successful.

This is the relevant code: open new tab on click:

$(document).on("click", ".button", function(){
    window.toSend = $(this);   
    window.newTab = window.open("test.html", "_blank");  

add the object to the new tab:

var data = parent.window.opener.toSend;
    $(".clickedButton").html(data);

Any solutions? or first, why is this even happening? thanks!

JQuery: How to intercept a click event and prevent inner element to receive it?

I've enclosed youtube embedded code inside a div. The div id is outer_viv. I've make the size of the screen relatively small to make the video look like a thumbnail.

<div id = "outer_div">
 <h2>First Leader Aside</h2>
 <p>
    <iframe width="200" height="112" src="https://www.youtube.com/embed/myvideo"
     frameborder="0" allowfullscreen="allowfullscreen"></iframe>
 </p>
</div>

When the thumbnail is click, I don't want the video to start playing. I want to intercept the click, add a border to show that the video has been selected and display a bigger screen of the video in the main content section of the page.

How do I intercept the click event with jquery?

Thanks for helping

How To insert data in mysql database using ajax in codeigniter?

I am trying to validate my form and insert the data in mysql database using ajax.Neither on submit validation is happening nor data is being inserted.I am making this in codeigniter framework. I am new bie to ajax.I am not able to figure out where am going wrong .Here is my code

View :

      <script  type="text/javascript">
      function validate_name(first_name){
        if(first_name.trim() == '' || first_name.length == 0){
        $('.first_name').show();
         $('.first_name').text('Please enter your name');
         return false;
    } else {
      $('.first_name').hide();
      return true;
    }
  }


  function validate_email(email_id){
    var pattern = new RegExp(/^[+a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/i);

    if(email_id.trim() == '' || email_id.length == 0){
      $('.email-id').show();
      $('.email-id').text('Please enter email address');
      return false;
    }else if(!pattern.test(email_id)) {
      $('.email-id').show();
      $('.email-id').text('Please enter valid email address');
      return false;
    } else {
      $('.email-id').hide();
      return true;
    }
  }

  function validate_inquiry_form(first_name,email_id){
    var username_validate = validate_name(first_name);
    var email_validate = validate_email(email_id);

    if(username_validate == true && email_validate == true){
      return true;
    } else {
      return false;
    }
  }

  $('#submit_enquiry').click(function(){

      var first_name      = $("input[name=first_name]").val();
      var last_name       = $("input[name=last_name]").val();
      var dob             = $("input[name=dob]").val(); 
      var gender          = $("input[name=gender] :radio:checked").val();
      var email_id        = $("input[name=email_id]").val();
      var password        = $("input[name=password]").val();
      var address         = $("input[name=address]").val();
      var phone           = $("input[name=phone]").val();
      var zipcode         = $("input[name=zipcode]").val();

      var validate_form = validate_inquiry_form(first_name,email_id);
      if(validate_form == true){
        $.ajax({
          url:'<?php echo base_url(); ?>member/register',
          type:'POST',
          data:{ 
                  first_name : first_name ,last_name : last_name ,dob : dob ,male : male ,female : female , email_id : email_id ,password : password ,phone : phone , address : address , zipcode : zipcode
               },

          success: function(data) {

            console.log(data);
          }
        });
      } else {
        return false;
      }
      return false;
  });
</script>


        <form id="registration-form">
          <div class="register">
                    <div class="row">
                          <div class="col1">
                              <label for="first_name">First Name<span>*</span></label> <br/>
                              <input type="text" name="first_name"/>
                    <li class="first_name error"></li>
                          </div>

                          <div class="col2">
                                Last Name<br/>
                                <input type="text" name="last_name"/>
                          </div>
                    </div>

                    <div class="row">
                          <div  class="col1">
                                Date Of Birth <br/>
                                <input type="text" name="dob"/>
                          </div>

                            <div  class="col2">
                              Gender
                              <br/>
                                <input type="radio" name="gender" value="Male" /> Male
                                <input type="radio" name="gender" value="Female" /> Female
                            </div>
                    </div>


                    <div class="row">
                          <div class="col1">
                                Email<br/>
                                <input type="text" name="email_id"/>
                    <li class="email-id error"></li>
                          </div>
                          <div class="col2">
                                Password<br/>
                                <input type="password" name="password"/>
                          </div>
                    </div>

                    <div class="row">
                            <div class="col">
                                  Address<br/>
                                  <textarea name="address" rows="2" ></textarea>
                            </div>
                    </div>

                    <div class="row">
                          <div class="col1">
                                Zipcode<br/>
                                <input type="text" name="zipcode"/>
                          </div>
                           <div class="col2">
                                  Phone<br/>
                                  <input type="text" name="phone"/>
                            </div>
                    </div>

                    <div class="row">
                        <div class="col3">
                          <input class="" type="button" id="submit_enquiry" name="submit_enquiry" value="Submit Enquiry" />
                        </div>
                    </div> 
          </div>
        </form>

Controller:

public function register_user()
    {
        $register_user  = $this->member_model->add_user();
        if($register_user)
        {                
            return true;
        }  
        else 
        {  
            return false;
        }
    }  

Model :

public function add_user()
{
    $add_user = array(
                    'mem_name'=> $this->input->post('first_name'),
                    'mem_lastname'=> $this->input->post('last_name'),
                    'mem_dob'=> $this->input->post('dob'),
                    'mem_gender'=> $this->input->post('gender'),
                    'mem_email'=> $this->input->post('email_id'),
                    'mem_address'=> $this->input->post('address'),
                    'mem_zipcode'=> $this->input->post('zipcode'),
                    'mem_phone'=> $this->input->post('phone'),
                    'mem_password'=> $this->input->post('password'),

    );

    $insert = $this->db->insert('membership', $add_user);
    $insert_id = $this->db->insert_id();
    return  $insert_id;
}

Please help me ....

jquery smooth scrolling errror $ not defined

I would like to implement a jquery smooth scrolling thing. So when I click on my navigation it should send me to the section of that page with a smooth animation.

This is the code I am talking about:

$(document).ready(function(){
    $('a[href^="#"]').on('click',function (e) {
        e.preventDefault();

        var target = this.hash;
        var $target = $(target);

        $('html, body').stop().animate({
            'scrollTop': $target.offset().top
        }, 900, 'swing', function () {
            window.location.hash = target;
        });
    });
});

This is my html code:

    <!DOCTYPE HTML>
<html>
    <head>
        <title></title>
        <script src="jquery/smooth_scroll.js"></script>
        <link href="css/style.css" rel="stylesheet" type="text/css" />
    </head>
    <body>
        <div id="wrapper">
        <div id="navigatie">
            <ul class="navigatie">
                    <li><a href="#specialties">We Are Flot</a></li>
                    <li><a href="#specialties">Our Specialties</a></li>
                    <li><a href="#projects">Projects</a></li>
                    <li><a href="#team">Team</a></li>
               </ul>
         </div>
            <header>
                <img class="logo" src="images/logo.png" alt="Loading.." />
                <img class="headerBg" src="images/header.png" alt="Loading.." />
            </header>
            <section class="main">
                <article id="specialties" class="specialties">
                    <h1 class="blue">Our specialties</h1>
                    <p class="description">We have a person for every specialty</p>

                    <article class="subjecs sub1">
                        <img class="diamond" src="images/diamond.png" alt="Loading.." />
                        <h2 class="blue">Ideas</h2>
                        <p class="black">Wij zetten uw visie, presentatie of idee om in overtuigende media producten en ondersteunen de vorming 

daarvan door met uw mee te denken, en vooral vooruit!</p>
                    </article>
                    <article class="subjecs">
                        <img class="wand" src="images/wand.png" alt="Loading.." />
                        <h2 class="blue">UX/UI</h2>
                        <p class="black">Wij zorgen ervoor door onze grote kennis van User Experience en User Interface dat de site niet 

alleen goed werk, maar er ook nog eens goed uitziet voor de gebruiker.</p>
                    </article>
                    <article class="subjecs">
                        <img class="tags" src="images/tags.png" alt="Loading.." />
                        <h2 class="blue">Code</h2>
                        <p class="black">Wij zorgen ervoor dat de code netjes en verzorgd word geschreven. De code zal met comments geschreven worden dat andere codeurs het kunnen lezen.</p>
                    </article>
                    <div class="clear"></div>
                </article>
            </section>
            <section class="secondPart">
                <article id="projects" class="projects">
                    <h1 class="white">Projects</h1>
                    <p class="white description">These are the projects that Flot have been working on</p>
                    <article class="projectItems project1">
                        <a href="#"><img class="testDing" src="images/extase.jpg" alt="Loading.." /></a>
                        <h2 class="white">Extase Tilburg</h2>
                        <p class="white">Extase Tilburg is een cafe/pub voor de echte muziek-liefhebber, waar iedere dag live-muziek te horen

is in talloze muziek genres.</p>
                        <a href="#"><img class="button" src="images/button.png" alt="Loading.." /></a>
                        <div class="spacer"></div>
                        <div class="clear"></div>
                    </article>
                    <article class="projectItems">
                        <div class="tint"><a href="#"><img class="testDing" src="images/obs.jpg" alt="Loading.." /></a></div>
                        <h2 class="white">OBS Den Bussel</h2>
                        <p class="white">De vorige site was te "grauw" voor een basisschool. Ons nieuwe design moet wat meer vreugde uitstralen maar toch de blauwe sfeer van de school blijven.</p>
                        <a href="#"><img class="button" src="images/button.png" alt="Loading.." /></a>
                        <div class="spacer"></div>
                        <div class="clear"></div>
                    </article>
                    <article class="projectItems">
                        <a href="http://ift.tt/1LMJtWp"><img class="testDing" src="images/lutastables.jpg" alt="Loading.." /></a>
                        <h2 class="white">Luta Stables</h2>
                        <p class="white">Luta Stables is een kleinschalige dressuurstal die zich richt op de training en in- en verkoop van paarden en pony's. Het was aan ons om een complete huisstijl voor luta stables te verzinnen.</p>
                        <a href="http://ift.tt/1LMJtWp"><img class="button" src="images/button.png" alt="Loading.." /></a>
                        <div class="spacer"></div>
                        <div class="clear"></div>
                    </article>
<!--                    <hr class="lijn">-->
                    <article class="projectItems project1">
                        <div class="spacer"></div>
                        <a href="#"><img class="testDing" src="images/tachos.jpg" alt="Loading.." /></a>
                        <h2 class="white">HV Tachos</h2>
                        <p class="white">HV Tachos is een handbalvereniging waar iedereen van jong tot oud welkom is. HV Tachos vroeg om een vernieuwende look en dat heeft flot gerealiseerd d.m.v. een one-page website.</p>
                        <a href="#"><img class="button2" src="images/button.png" alt="Loading.." /></a>
                        <div class="clear"></div>
                    </article>
                    <article class="projectItems">
                        <div class="spacer"></div>
                        <a href="http://ift.tt/1KklHnl"><img class="testDing" src="images/NailAngel.jpg" alt="Loading.." /></a>
                        <h2 class="white">NailAngel</h2>
                        <p class="white">NailAngel is een nagelstudio waarbij iedereen welkom is. Ze had een website die aan vernieuwing toe was en wil een website die zorgt voor een volle agenda! Hier gaan wij voor zorgen.</p>
                        <a href="http://ift.tt/1KklHnl"><img class="button2" src="images/button.png" alt="Loading.." /></a>
                        <div class="clear"></div>
                    </article>
                    <div class="clear"></div>
                </article>
            </section>
            <section class="thirdPart">
                <article id="team" class="team">
                    <h1 class="blue">Team</h1>
                    <p class="description">Flot is a five persons team</p>

                    <article class="people">
                        <a href="#"><img src="images/team/rick.png" alt="Loaing.." /></a>
                    </article>
                            <img class="blueBall" src="images/team/blueBall.png" alt="Loaing.." />
                    <article class="people">
                        <a href="http://ift.tt/1LMJrxJ"><img class="secondRow" src="images/team/sander.png" alt="Loaing.." /></a>
                    </article>
                            <img class="blueBall" src="images/team/blueBall.png" alt="Loaing.." />
                    <article class="people">
                        <a href="http://ift.tt/1KklHnn"><img src="images/team/kevin.png" alt="Loaing.." /></a>
                    </article>
                            <img class="blueBall" src="images/team/blueBall.png" alt="Loaing.." />
                    <article class="people">
                        <a href="#"><img class="secondRow" src="images/team/monique.png" alt="Loaing.." /></a>
                    </article>
                            <img class="blueBall" src="images/team/blueBall.png" alt="Loaing.." />
                    <article class="people">
                        <a href="#"><img src="images/team/jasper.png" alt="Loaing.." /></a>
                    </article>
                    <div class="clear"></div>
                </article>
            </section>
            <footer>
<!--
                <div class="copy">
                    <img class="footerLogo" src="images/logoFooter.png" alt="Loading.." />
                </div>
-->

                <article class="footer">
                    <article class="rij">
                        <h3>Recent werk</h3>

                        <a href="#" target="_blank"><p class="pFooter">Extase Tilburg</p></a>
                        <a href="#" target="_blank"><p class="pFooter">OBS Den Bussel</p></a>
                        <a href="http://ift.tt/1LMJtWp" target="_blank"><p class="pFooter">Luta Stables</p></a>
                        <a href="#"><p class="pFooter" target="_blank">HV Tachos</p></a>
                        <a href="http://ift.tt/1LMJrxM" target="_blank"><p class="pFooter">NailAngel</p></a>
                    </article>
                    <article class="rij">
                        <h3>Flot</h3>

                        <a href="http://ift.tt/1LMJrxJ" target="_blank"><p class="pFooter">Sander Mateijsen</p></a>
                        <a href="#" target="_blank"><p class="pFooter">Jasper Peters</p></a>
                        <a href="http://ift.tt/1KklHnn" target="_blank"><p class="pFooter">Kevin Vugts</p></a>
                        <a href="#" target="_blank"><p class="pFooter">Rick van Boxtel</p></a>
                        <a href="#" target="_blank"><p class="pFooter">Monique van der Harst</p></a>
                    </article>
                    <article class="rij">
                        <h3>Diensten</h3>

                        <p class="pFooter">Code</p>
                        <p class="pFooter">UX / UI</p>
                        <p class="pFooter">Webdesign</p>
                        <p class="pFooter">CMS Systemen</p>
                        <p class="pFooter">Reclame</p>
                    </article>
                    <article class="rij">
                        <h3>Links</h3>

                        <a href="#" target="_blank"><p class="pFooter">Facebook</p></a>
                        <a href="#" target="_blank"><p class="pFooter">Linkedin</p></a>
                        <a href="#" target="_blank"><p class="pFooter">Twitter</p></a>
                        <a href="#" target="_blank"><p class="pFooter">Flickr</p></a>
                        <a href="#" target="_blank"><p class="pFooter">Behance</p></a>
                    </article>
                    <article class="footerLogo">
                        <img class="footerLogo" src="images/logoFooter.png" alt="Loading.." />
                    </article>
                    <p class="copyright">Copyright 2015 | Flot Grafisch Design Bureau. Alle rechten voorbehouden.</p>
                </article>
            </footer>
        </div>
    </body>
</html>

It should send me to the section specialities when clicked on the <li> specialities. and the same for all other <li> items in my navigation in the top.

Unfortunately I am getting the error:$ is not defined. Can you help me out with this?

Pulling data with YQL and jQuery

I am using YQL to pull basic information from a div on atlatlsoftware.com. I need to find the address,phone number, and email.

My current code turns the data from YQL and logs it in the console as JSON.

var atlatlInfo = $.getJSON("http://ift.tt/1Ik6MYH'%2F%2F*%5B%40id%3D%22desktop-footer%22%5D%2Fdiv%5B3%5D%2Fdiv%2Ftable%2Ftbody%2Ftr%5B2%5D%2Ftd%5B1%5D'&format=json&diagnostics=true&callback=");

console.log(atlatlInfo);

By typing atlatlInfo.responseJSON.query.results.td.div in chrome console, i can get to the data I need. When i try to do console.log(atlatlInfo.responseJSON.query.results.td.div) my chrome console comes up with "undefined".

How do i get to the data i need to use, with javascript?

$(...).pushpin is not a function - reactJs, Materializecss

I've made up the page with jquery and materializecss. All js worked well in it. But as soon as I've transferred it to reactJs components, one of js scripts stopped work.

Here the component. As you can see, there is another js initialization right above, from the same materialize.min.js, and it works perfectly. Why the second one doesn't?

    var React = require('react');

var CharSpy = React.createClass({
    componentDidMount: function() {
    // this one works well
    $('.scrollspy').scrollSpy();
    // this one doesn't work
    $('.tabs-wrapper').pushpin({ offset: 65 });
    },
    render: function() {
        return (
        <div className="tabs-wrapper">
            <ul className="section table-of-contents">
          <li><a href="#user"><span className="hide-on-small-only">Профиль</span></a></li>
          <li><a href="#abilities"><span className="hide-on-small-only">Способности</span></a></li>
          <li><a href="#activity"><span className="hide-on-small-only">Статистика</span></a></li>
          <li><a href="#skillmap"><span className="hide-on-small-only">Карта</span></a></li>
          <li><a href="#comments"><span className="hide-on-small-only">Комментарии</span></a></li>
        </ul>
        </div>
        );
    }

});

module.exports = CharSpy;

The error:

Uncaught TypeError: $(...).pushpin is not a function
React.createClass.componentDidMount @ main.js:22993
assign.notifyAll @ main.js:3920O
N_DOM_READY_QUEUEING.close @ main.js:17089
Mixin.closeAll @ main.js:19861
Mixin.perform @ main.js:19802
batchedMountComponentIntoNode @ main.js:15144
Mixin.perform @ main.js:19788
ReactDefaultBatchingStrategy.batchedUpdates @ main.js:12271
batchedUpdates @ main.js:18015
ReactMount._renderNewRootComponent @ main.js:15279
ReactPerf.measure.wrapper @ main.js:16518
ReactMount.render @ main.js:15368
ReactPerf.measure.wrapper @ main.js:16518
(anonymous function) @ main.js:23680
React.createClass.statics.run.dispatchHandler @ main.js:1852(
anonymous function) @ main.js:1820(
anonymous function) @ main.js:874(a
nonymous function) @ main.js:874Tr
ansition.to @ main.js:877(a
nonymous function) @ main.js:1819T
ransition.from @ main.js:856di
spatch @ main.js:1816r
efresh @ main.js:1867r
un @ main.js:1863r
unRouter @ main.js:25552
25../components/app @ main.js:23679
s @ main.js:1e @ 
main.js:1(ano
nymous function)

Combine javascript filters with jqPagination

I am using javascript to filter elements on a page using show/hide. I would like to use jqPagination with this as well. The problem is that jqPagination also uses show/hide. So if a user clicks a filter link it will hide a number of the elements on the page and only show them the filtered results. I would then like jqPagination to paginate only the filtered results and not all the elements on the page anymore. This may not be possible, but maybe there is another strategy for combining filtering with paginating?

handling client side error from REST API

I use ajax() and the result I got is a list of object array. When user pass invalid param, instead of the server side give me an invalid message it gave me fatal error (PHP). I have no control over the PHP, how should I catch if there's invalid respond?

I can't do respond == 'undefined'.

Setting up a Spline chart size and the image size inside the chart flexible with the browser window size

I have created a Spline chart using DevExpress controls. I want the full chart to make flexible using JS and JQuery. The problem is if I am setting up the size of the chart using JQuery and css, like using below code, the image is getting blur.

$('#myChart_IMG').css('height', $(window).height()).css('width', $(window).width());

And if I am setting the chart size using devexpress code for sizing, then it is not becoming flexible. Like the below code.

settings.Width = 1366;
settings.Height = 763; 

What can be the solution? Below is my full code.

<style type="text/css">
    body, html {
        height: 100%;
        width: 100%;
        margin: 0;
        padding: 0;
        overflow: hidden;
    }
</style>
<script src="~/Scripts/jquery-1.10.2.min.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $('#myChart_IMG').css('height', $(window).height()).css('width', $(window).width());
    })
</script>
@Html.DevExpress().Chart(settings =>
{
    settings.Name = "myChart";
    settings.Width = 1366;
    settings.Height = 763;
    Series chartSeries1 = new Series("My Data", DevExpress.XtraCharts.ViewType.Spline);
    chartSeries1.ArgumentDataMember = "X";
    chartSeries1.ValueDataMembers[0] = "Y";
    Series chartSeries2 = new Series("My Chart", DevExpress.XtraCharts.ViewType.Spline);
    chartSeries2.ArgumentDataMember = "X";
    chartSeries2.ValueDataMembers[0] = "Z";
    settings.Series.Add(chartSeries2);
    settings.Series.Add(chartSeries1);
}).Bind(Model).GetHtml()

Ajax search filter

I have a table 'content' you can assign categories to your content.

class Content
{

    private $name;

    private $categories;

    ...
    ...
    ...

    public function __construct()
    {
        $this->categories = new \Doctrine\Common\Collections\ArrayCollection();
    }

    public function addCategories(\Publicartel\AppBundle\Entity\Category $categories)
    {
        $this->categories[] = $categories;

        return $this;
    }

    public function removeCategories(\Publicartel\AppBundle\Entity\Category $categories)
    {
        $this->categories->removeElement($categories);
    }

    public function setCategories(\Publicartel\AppBundle\Entity\Category $categories = null)
    {
        $this->categories = $categories;

        return $this;
    }

    public function getCategories()
    {
        return $this->categories;
    }

}

Then I do a query to find all categories and display them on a page.

$categories = $em->getRepository('PublicartelAppBundle:Category')->getAllCategories();

public function getAllCategories()
    {

    $em = $this->getEntityManager();

    $dql = 'SELECT c FROM Publicartel\AppBundle\Entity\Category c';

    $query = $this->getEntityManager()
        ->createQuery($dql)
        ->setHydrationMode(\Doctrine\ORM\Query::HYDRATE_ARRAY);

    return $query->execute();
}

Showing all categories in the template twig.

<div class="form-group">
            <label for="publicartel_appbundle_category_name">Buscar por categoría:</label>
            <select id='selectCategory' class="form-control select2">
                {% for categories in categories %}
                    <option>
                        {{ categories.name }}
                    </option>
                {% endfor %}
            </select>
        </div>

I assign a handle to select that displays categories, to pass the value from the select, within the ajax.

I have a function to detect the change in the select option chosen.

Save select value to pass to the controller to perform the query:

$('#selectCategory').change(function() {
                var optionSelect = $(this).val();
                console.log(optionSelect);
                $.ajax({
                    url: '{{path('playlist_new') }}', 
                    data: '&category='+optionSelect,
                    type: 'POST',
                    success: function(catContent) {

                    {% for contentCategory in catContent %}
                        var nameContent =  '{{ contentCategory.name }}';
                        console.log(nameContent);
                    {% endfor %}

                    $('playlist_content_name').html(nameContent);
                },
                error: function(e){
                    console.log(e.responseText);
                }
            });
        });

$category = $request->query->get('category');

    $catContent = $em->getRepository('PublicartelAppBundle:Content')->findByCategory($category);

return $this->render('PublicartelAppBundle:Playlist:new.html.twig', array(
            'catContent' => $catContent, 
            'categories' => $categories,
            'entity'     => $entity,
            'form'       => $form->createView(),
        ));

The query to display the contents from the selected category:

public function findByCategory($category)
    {
        $em = $this->getEntityManager();

    $dql = 'SELECT c FROM Publicartel\AppBundle\Entity\Content c';

    if (!is_null($category)) {
        $dql .= " WHERE c.categories.name LIKE :category";
    }

    $query = $this->getEntityManager()
        ->createQuery($dql)
        ->setHydrationMode(\Doctrine\ORM\Query::HYDRATE_ARRAY);

    if (!is_null($category)) {
        $query->setParameter('category', '%'.$category.'%');
    }

    return $query->getResult();
}

But console always shows the same result but in my select choose different options.

Is to select the option you select, always shows the same result.

lundi 11 mai 2015

Parameter @code1 has no default value

I'm creating this code to use two comboboxes, one that depends on the first, but when I'm trying to select the "code_Zone" from the Table "Zone" I have this exception:

Parameter @code1 has no default value

This is my code:

Dim cmd3 = New OleDbCommand("select [Code_Zone] from [Zone] where [Nom_Zone]= '@code';", connection)
cmd3.Parameters.AddWithValue("@code", ComboBoxNomZoneDeclaration.SelectedText.ToString)
Dim valeur = cmd3.ExecuteScalar
Dim commande = New OleDbCommand("select [Code_Cable] from [CableEnFibre] where [Code_Zone]=@code1;", connection)
commande.Parameters.AddWithValue("@code1", valeur)
Dim reader = commande.ExecuteReader   'there is the exception 
While reader.Read
    ComboBoxPanneCentreAppel.Items.Add(reader.GetInt32(reader.GetOrdinal("Code_Cable")))
End While
reader.Close()

Different Browsers are displaying HTML differently

I am working on some HTML code, its really old code so its not something I am really used to seeing. I made a small change to the code, moved the save button, but when I display it in each of the browsers im testing on, Firefox,Chrome,IE they all look different. Firefox is displaying it the way I want it to enter image description here

But the other two are displaying the same page, with the same exact code incorrectly. IE enter image description here

Chromeenter image description here

Here is my code, please let me know what has gone wrong im not sure how to fix this is issue. Thanks!

    <div id="textdefaults" runat="server">
    <div>
    <asp:Button ID="btnSubmitTextDefaults" Text="Save" runat="server" Height="29px" style="margin-left: 900px" Width="64px" OnClick="btnSubmitTextDefaults_Click" OnClientClick="SaveLanguage();" />
    </div>
    <div class="aTab">
        <asp:UpdatePanel ID="upTextDefaults" runat="server" UpdateMode="Conditional">
            <ContentTemplate>
                <div class="aTab">
                <TagUpdate:TextDefaults id="myTextDefaults" runat="Server" />
                    <asp:UpdateProgress ID="UpdateProgress3" runat="server">
                        <ProgressTemplate>
                            <div class="progress">
                            <asp:Image ID="imgTextDefaults" runat="server" ImageUrl="~/Bannerlink/Images/ajax-loader-big.gif" />Saving...
                            </div>
                        </ProgressTemplate>
                    </asp:UpdateProgress>
                </div>
            </ContentTemplate>
            <Triggers>
                <asp:AsyncPostBackTrigger ControlID="btnSubmitTextDefaults" EventName="Click" />
            </Triggers>
        </asp:UpdatePanel>
    </div>
   <br />
</div>

how to process.MainWindowTitle.Contains(str1,str2,str3.....)

I am trying to find more than one MainWindowTitle to a process

for example I have a string in My.resource like this: google:yahoo:msn:ebay....etc and I

have this code to look if one of the strings in my resource string exists to

show a message box

Private Sub Timer1_Tick(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Timer1.Tick
    Dim LOKUP As New Process
    For Each LOKUP In Process.GetProcesses
        If LOKUP.MainWindowTitle.Contains(Split(My.Resources.String2, ":").ToString) Then
            MsgBox("Allowed - Site - Web")
        Else
            MsgBox("This Site Is Forbidden Sorry")
            'close site
        End If
    Next
End Sub

the problem this code didn't work because the function Contains have only one string.

thank you for your help in advance

Calling COM method results in 'type mismatch' error code -2146828275

I'm calling a COM object from .NET, and the 4th line below is erroring out.

object1 = CreateObject("something1.something2")
object1.OpenDocument(fileNameCopy, False, 0)
object1.SetProperty("Status", "Edit")
object1.CloseDocument()

The error is:

Type mismatch

Error code:

-2146828275

How can I be passing the wrong type to CloseDocument()? Is it something other than a method? If so, how can I determine how to use it if I only have the DLL, and not the source code?

This works on other machines, so it seems to be an environment or version issue.

I searched on SO and found similar questions, but no solution.

Button event handler not fired and the text box value not stored when navigating to another pages

I am just learning ASP.net. Well, I have a little problem with asp.net web page. I have 2 web forms, WebForm1 with just a single DataGrid control, and WebForm2 with a pair of Label and TextBox, and 2 Buttons.

Straight to the point, here is my code for WebForm1:

Imports System.Configuration.ConfigurationManager
Imports System.Data.SqlClient

Public Class WebForm1
    Inherits System.Web.UI.Page

    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
        Dim strConn As String = ConnectionStrings("ConnStr").ConnectionString
        Dim sqlConn As SqlConnection = New SqlConnection(strConn)
        Dim sqlComd As SqlCommand = New SqlCommand
        Dim sqlRead As SqlDataReader = Nothing
        Dim sqlParm As SqlParameter

        sqlParm = New SqlParameter("@Criteria", SqlDbType.NVarChar, 50)
        sqlParm.Value = ""

        sqlComd.Connection = sqlConn
        sqlComd.CommandText = "ShowCategory"
        sqlComd.Parameters.Add(sqlParm)
        sqlComd.CommandType = CommandType.StoredProcedure

        Try
            sqlConn.Open()
            sqlRead = sqlComd.ExecuteReader()
            grdCategory.DataSource = sqlRead
            grdCategory.DataBind()
        Catch ex As Exception
            Throw ex
        Finally
            sqlConn.Close()
        End Try
    End Sub

    Private Sub grdCategory_SelectedIndexChanged(sender As Object, e As EventArgs) Handles grdCategory.SelectedIndexChanged
        Server.Transfer("~/WebForm2.aspx", False)
    End Sub
End Class

And here is my code for WebForm2:

Imports System.Configuration.ConfigurationManager
Imports System.Data.SqlClient

Public Class WebForm2
    Inherits System.Web.UI.Page

    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
        If Not IsPostBack Then
            Dim prevPage As Page = Me.Page.PreviousPage
            If prevPage IsNot Nothing Then
                Dim ctn As ContentPlaceHolder = CType(prevPage.Master.FindControl("MainContent"), ContentPlaceHolder)
                Dim grd As GridView = CType(ctn.FindControl("grdCategory"), GridView)
                ViewState("ID") = grd.SelectedRow.Cells(1).Text
                txtName.Text = grd.SelectedRow.Cells(2).Text
                txtDesc.Text = grd.SelectedRow.Cells(3).Text
            End If
        End If
    End Sub

    Protected Sub btnBack_Click(sender As Object, e As EventArgs) Handles btnBack.Click
        Response.Redirect("~/WebForm1.aspx")
    End Sub

    Protected Sub btnSave_Click(sender As Object, e As EventArgs) Handles btnSave.Click
        Dim strConn As String = ConnectionStrings("ConnStr").ConnectionString
        Dim sqlConn As SqlConnection = New SqlConnection(strConn)
        Dim sqlComd As SqlCommand = New SqlCommand
        Dim sqlParm(2) As SqlParameter

        sqlParm(0) = New SqlParameter("@CategoryID", SqlDbType.Int, 0)
        sqlParm(1) = New SqlParameter("@CategoryName", SqlDbType.NVarChar, 15)
        sqlParm(2) = New SqlParameter("@Description", SqlDbType.NText)

        sqlParm(0).Value = ViewState("ID").ToString
        sqlParm(1).Value = txtName.Text.Trim
        sqlParm(2).Value = txtDesc.Text.Trim

        sqlComd.Parameters.AddRange(sqlParm)
        sqlComd.CommandText = "InsertCategory"
        sqlComd.CommandType = CommandType.StoredProcedure

        Try
            sqlConn.Open()
            sqlComd.ExecuteNonQuery()
        Catch ex As Exception
            Throw ex
        Finally
            sqlConn.Close()
        End Try
    End Sub
End Class

The logic is, I select a row in datagrid control and pass the values of the selected row to the textbox control in WebForm2.

But after I change the value of the textbox and I press save button, the btnSave_Click did not executed and it seem the value of the textbox did not change too. I try debugging, and after I press the save button, it execute the page_load event and did not execute the btnSave_Click event.

The questions, is anyone know the reason why the btnSave_Click event did not executed, and how to fix it, so the btnSave_Click can executed after I press the button.

EDIT

Here is the markup for each web form

Webform1

<%@ Page Title="" Language="vb" AutoEventWireup="false" MasterPageFile="~/Site.Master" CodeBehind="WebForm1.aspx.vb" Inherits="WebApplication2.WebForm1" %>

<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">
    <asp:GridView ID="grdCategory" runat="server" AutoGenerateSelectButton="True" CellPadding="4" ForeColor="#333333" GridLines="None">
        <AlternatingRowStyle BackColor="White" ForeColor="#284775" />
        <EditRowStyle BackColor="#999999" />
        <FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
        <HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
        <PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" />
        <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
        <SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
        <SortedAscendingCellStyle BackColor="#E9E7E2" />
        <SortedAscendingHeaderStyle BackColor="#506C8C" />
        <SortedDescendingCellStyle BackColor="#FFFDF8" />
        <SortedDescendingHeaderStyle BackColor="#6F8DAE" />
    </asp:GridView>
</asp:Content>

Webform2

<%@ Page Title="" Language="vb" AutoEventWireup="false" MasterPageFile="~/Site.Master" CodeBehind="WebForm2.aspx.vb" Inherits="WebApplication2.WebForm2" %>

<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">
    <br />
    <div class="row">
        <div class="col-md-2">
            <p>Category Name: </p>
        </div>
        <div class="col-md-10">
            <asp:TextBox ID="txtName" Width="300px" runat="server"></asp:TextBox>
        </div>
    </div>
    <div class="row">
        <div class="col-md-2">
            <p>Description: </p>
        </div>
        <div class="col-md-10">
            <asp:TextBox ID="txtDesc" Width="300px" runat="server" TabIndex="1"></asp:TextBox>
        </div>
    </div>
    <div class="row">
        <div class="col-md-2">
        </div>
        <div class="col-md-10">
            <asp:Button ID="btnBack" runat="server" Text="Back" Width="70px" OnClick="btnBack_Click" />
            &nbsp;<asp:Button ID="btnSave" Width="70px" Text="Save" runat="server" OnClick="btnSave_Click" />
        </div>
    </div>
</asp:Content>